角度ng-repeat不会在视图中更新

时间:2016-04-14 00:49:39

标签: angularjs

当我通过$scope.d更新$mdDialog数组时,ng-repeats数据的视图不会更新。我已尝试使用$scope.$apply()$scope.digest(),但我仍然收到错误“$scope.digest()已在进行中”

HTML

           <md-list-item  ng-click="showPrompt($event)" >
              <a>
                <md-item-content md-ink-ripple layout="row" layout-align="start center">
                  <div class="inset">
                    <ng-md-icon icon="note_add"></ng-md-icon>
                  </div>
                  <div class="inset">Add Deck
                  </div>
                </md-item-content>
              </a>
            </md-list-item>

 <div ng-controller="deck" id="curDeck">
      <md-list-item class="md-3-line" ng-repeat="deck in d" ng-click="showDeck($event, $index).bind(this)">
      <div class="md-list-item-text" layout="column">
        <td>{{deck.deckname}}</td>
      </div>
     </md-list-item>
</div

控制器

var app = angular.module("app",['ngMaterial', 'ngMdIcons'])

.controller("deck",  function($scope,  $mdDialog, $mdMedia) {

 $scope.d = [
   {
     deckname: 'NewDeck',
     deck: [
      {front: "a cappella", back: "without accompaniment"},
      {front: "avuncular" , back: "like an uncle"},
      {front: "collusion" , back: "conspiracy"},
      {front: "Javascript", back: "pain in the ass"},
      {front: "Angular", back: "$scope is fun to work with"}
    ]   
   }
  ];
  $scope.showPrompt = function(ev) {
    // Appending dialog to document.body to cover sidenav in docs app
    $scope.confirm = $mdDialog.prompt()
          .title('Add a Deck')
          .textContent('Your decks are belong to us')
          .placeholder('deck name')
          .targetEvent(ev)
          .ok('Okay!')
          .cancel('Cancel');

    return $mdDialog.show($scope.confirm).then(function(name){
      console.log(name);
      $scope.d.push({
        deckname: name,
        deck:[]
      });
    });
  };

};

1 个答案:

答案 0 :(得分:0)

问题似乎是以下代码

return $mdDialog.show($scope.confirm).then(function(name){
  console.log(name);
  $scope.d.push({
    deckname: name,
    deck:[]
  });
});

return $ mdDialog将$ showPrompt从函数转换为promise。摆脱&#34;返回&#34;言。

你应该将$ scope.confirm保存为局部变量,如var confirm。您不需要直接从作用域访问confirm函数,只需在此函数中。

所以代码可能需要像这样:

$scope.showPrompt = function(ev) {
// Appending dialog to document.body to cover sidenav in docs app
var confirm = $mdDialog.prompt()
      .title('Add a Deck')
      .textContent('Your decks are belong to us')
      .placeholder('deck name')
      .targetEvent(ev)
      .ok('Okay!')
      .cancel('Cancel');

$mdDialog.show(confirm).then(function(name){
  console.log(name);
  $scope.d.push({
    deckname: name,
    deck:[]
  });
});