ionci中这个单选按钮当被点击的时候为什么pre标签里的值也会改变,数据是怎么关联传递的

ionci中这个单选按钮当被点击的时候为什么pre标签里的值也会改变,数据是怎么关联传递的

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
    <link rel="stylesheet" href="lib/css/ionic.min.css">
</head>
<body ng-app="myApp" ng-controller="lvCtrl">

    <!--
        单选框

        <ion-radio></ion-radio>
     -->

    <ion-header-bar>
        <h1 class="title">你的性取向</h1>
    </ion-header-bar>
    <ion-content>
        <ion-radio
            icon="ion-home"
            name="sex"
            ng-repeat="item in items"
            ng-model="obj.love"
            ng-value="item">{{ item }}</ion-radio>

        <pre>{{ obj.love }}</pre>
    </ion-content>



    <script src="lib/js/ionic.bundle.min.js"></script>
    <script>
        var app = angular.module('myApp', ['ionic']);

        app.controller('lvCtrl', ['$scope', function($scope){

            $scope.items = ['男', '女', '人妖'];

            $scope.obj = {
                'love': '人妖'
            };


        }])
    </script>
</body>
</html>
阅读 2.2k
2 个回答

首先ionic是基于angularjs框架的,这你知道吧。angularjs最大的特点就是双向数据绑定,变量发生变化,变量发生引用的地方就都跟着改变了。

<pre>{{::obj.love }}</pre>

写成这样,就只显示加载的值,点击不会改变了。

这不就是双向数据绑定么?

 <ion-radio
            icon="ion-home"
            name="sex"
            ng-repeat="item in items"
            ng-model="obj.love"
            ng-value="item">{{ item }}
  </ion-radio>
  <pre>{{ obj.love }}</pre>

按钮的值和pre标签中的文本都是obj.love,有一方变,另一个地方也要跟着变

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题