美文网首页AngularJS开发WebAppAngular.js专场
ng-repeat与ng-model的简单搭配使用

ng-repeat与ng-model的简单搭配使用

作者: 灬弑念 | 来源:发表于2016-11-03 12:00 被阅读67次

    目标实现:通过点击<li>标签的点击事件改变<p>标签的内容

    <div ng-app="MyApp" ng-controller="MyCtrl">

    <p ng-model ="myText" ng-init = "myText = '大连'">{{myText}}</p>

    <ul>

    <li ng-repeat = "x in citys">

    <a href="#" ng-click="myClick(x)">{{x}}</a>

    </li>

    </ul>

    </div>

    <script>

    var myApp = angular.module("MyApp", []);

    myApp.controller("MyCtrl", function ($scope){

    $scope.citys = ["大连", "北京", "上海"];

    $scope.myClick = function (x){

    $scope.myText = x;

    };

    });

    </script>

    相关文章

      网友评论

        本文标题:ng-repeat与ng-model的简单搭配使用

        本文链接:https://www.haomeiwen.com/subject/kybbuttx.html