角度流星:改变模型值不会改变视图

时间:2016-03-22 11:28:49

标签: angularjs meteor ionic-framework angular-meteor

我正在使用角度流星和离子来处理todo应用程序。 我有一个输入和列表的视图。 当我单击编辑时,项目的名称应出现在输入上并进行编辑,然后应用。 到目前为止,一切正常,但在您应用更改后,您输入的文本卡在那里,如果您点击另一个待办事项进行编辑,其标题不会显示在输入中,但如果您写点击应用,它会改变。

enter image description here

这是视图的代码:

<ion-view view-title="Task ongoing">
    <ion-content>
            <div class="item item-input-inset">
                <label class="item item-input">
                    <input type="text" ng-model="n" placeholder="click on a task to edit it">
                </label>
                <button class="button button-balanced button-small"
                        style="margin:1%"
                        ng-click="editTask(n)">
                    <span class="glyphicon glyphicon-plus"></span> Apply</button>
            </div>
        <ion-item ng-repeat="t in todos | filter:'ongoing'">
          {{t.name}} <strong>{{t.status}}</strong> <span class="badge" ng-click="enableEditTask(t)" >Edit</span>
            <span class="badge" ng-click="makeTaskDone(t)" style="right: 67px" >Done</span>
        </ion-item>
    </ion-content>
</ion-view>

以下是服务器中的方法代码:

Meteor.methods({
        makeDone:function(task){
            Todos.update({_id:task._id},{$set:{status:'done'}});
        },
        editTask:function(name,task){
            Todos.update({_id:task._id},{$set:{name:name}});
        }
    })

这里是客户端上的代码(有角度的)

$scope.makeTaskDone=function(task){
                Meteor.call('makeDone',task);
            };

            $scope.enableEditTask = function(task) {
                $scope.task=task;
                $scope.n=task.name;
            };

            $scope.editTask=function(name){
                Meteor.call('editTask',name,$scope.task);
                $scope.n="";
            }

我认为问题发生在Todos.update被调用之后,因为当我没有尝试时,一切正常。

Ps:我用不安全的包试过了,发生了同样的问题。

1 个答案:

答案 0 :(得分:0)

如果您要更改角度以外的$scope模型,则应在$scope.$apply(...)中调用您的方法。这是如此有角度可以运行摘要并拾取更改然后更新视图(ngDocs)。这适用于所有未由angular调用的异步函数。