angular.js - angularJS ng-repeat
天蓬老师
天蓬老师 2017-05-15 16:54:09
0
2
537

页面使用了ng-repeat生成了view。在controller里修改了ng-repeat的ng-model。view没有修改是什么么?

$scope.search = function(page){
        $scope.orData.page = page==0?1:page;
        $scope.$watch("orData", function(){
            orderService.searchData($scope.orData).then(function(res){
                $scope.res = res.data;
                if ($scope.res != undefined) {
                    if ($scope.res.page_items.length == 0) {
                        alert("没有订单数据");
                    }else{
                        $scope.tds = $scope.res.page_items;
                        $timeout(function(){
                            console.log($scope.tds);
                        }, 1000);
                    };
                }else{
                    $scope.tds = "";
                    $("#orPaging").empty();
                    alert("订单号不能为非数字");
                };
            });
        });
    };
//
<tbody>
    <tr ng-repeat="td in tds"><!--  -->
        <td>{{td.tid}}</td>
        <td>{{td.created}}</td>
        <td>{{td.buyer_nick}}</td>
        <td>{{td.payment}}</td>
        <td>{{td.shop_name}}</td>
        <td>{{td.title}}</td>
        <td>{{td.seller_memo}}</td>
        <td>{{td.shipping_type}}</td>
        <td>{{td.status}}</td>
        <td>{{td.receiver_name}}</td>
        <td><button type="button" class="btn btn-primary btn-sm" data-tid="{{td.tid}}" ng-click="detail($event)">查看</button></td>
                    </tr>
</tbody>

第一次刷新$scope.tds,view是有改变的。但是再次给$scope.tds赋值,view就不再改变了。
但是如果$scope.tds的长度有变,view又会变了,这是为什么呢?

天蓬老师
天蓬老师

欢迎选择我的课程,让我们一起见证您的进步~~

membalas semua(2)
習慣沉默

Pertama sekali, saya ingin bercakap tentang dua isu penamaan dalam kod:

  1. "td in td"Apa kejadahnya, Angular sebenarnya boleh melaksanakannya dengan betul. Adalah disyorkan untuk membezakan kedua-dua nama, sebagai contoh, menukarnya kepada td in tds.
  2. a dan b memang dinamakan seperti ini, tetapi apabila menulis pengawal, adakah anda perlu sentiasa memikirkan apakah a itu? Oh, itu $scope. Kenapa tidak namakan sahaja $scope.

Baiklah, tanpa berlengah lagi, mari jawab soalan anda. Pada masa a.td = [], a.td merujuk kepada tatasusunan lain dan tatasusunan asal tidak berubah. Tatasusunan asal terikat dalam templat. Ini sememangnya perangkap AngularJS, tetapi anda lebih baik menggunakan push, pop, splice, dsb. untuk mengendalikan tatasusunan Jika anda ingin menggantikan keseluruhan tatasusunan, adalah disyorkan bahawa anda melakukannya seperti ini:

javascripta.td.splice(0, a.td.length, {tid:"111", created:"222"}, {tid:"333", created:"444"});

Untuk mekanisme pengikatan data yang lebih terperinci dan proses kemas kini AngularJS, sila rujuk artikel ini:
http://harttle.github.io/2015/06/06/angular-data-binding-and-digest . ht...

習慣沉默
javascript<body ng-app="scopeExample">


<p ng-controller="MyController">
    <p>
      <table>
    <tr ng-repeat="td in tds">
        <td>{{td.tid}}</td>
        <td>{{td.created}}</td>
        <td><button type="button" class="btn btn-primary btn-sm" data-tid="{{td.tid}}" ng-click="detail($event)">查看</button></td>
    </tr>
    </table>
    <button ng-click="change()">button</button>
</p>
</p>


</body>

sdApp.controller('MyController', ['$scope', function($scope) {
    $scope.change = function(){
       $scope.tds = [{tid:"321", created:"456"}, {tid:"abc", created:"def"}];
    };
}]);

Cubalah
http://plnkr.co/edit/6tNYE0boiI6CXdKtckpa?p=preview

Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan