我有一个关于 AngularJS 的问题；这是我不理解的行为——也就是说，我曾预料到一件事，但得到了完全不同的东西。现在意外的行为本身可能是正确的，但我想了解它为什么会发生。
鉴于这个非常粗略的代码（这是充当 POC 的实际代码）：
angular.module('myApp')
.factory('Promises', function ($q) {
return {
promises: function (val) {
var d = $q.defer();
setTimeout(function() {
d.resolve(val);
}, 1000);
return d.promise;
}
};
});
angular.module('myApp')
.controller('MainCtrl', function (Promises) {
console.log("Reload!");
this.messages = this.messages || [ "hello" ];
var that = this;
this.scrappy = function() {
console.log("Before: ", that.messages);
Promises.promises(12).then(function(promise) {
console.log("Fetching a promise", promise);
that.messages.push("" + promise.toString());
console.log("During: ", that.messages);
}).finally(
function(x) { console.log("Finaly: ", that.messages); }
);
};
});
到目前为止，一切都很好; 我有一个scrapy 函数，当我ng-click按下某个按钮时，会调用scrapy 函数，它会触发一个promise，一秒钟后列表会收到一个带有插入值的推送。
正确的？至少; 那是我的假设...
结果发生了其他事情，我不知道为什么，或者背后的原因是什么。
当我在浏览器中启动我的应用程序并单击按钮两次时；这是 console.log 告诉我的：
# first hit
Reload! main.js:12
# now I click the button
Before: ["hello"] main.js:17
Reload! main.js:12
Fetching a promise 12 main.js:20
During: ["hello", "12"] main.js:22
Finaly: ["hello", "12"] main.js:25
# now I click the button again
Before: ["hello"] main.js:17
Reload! main.js:12
Fetching a promise 12 main.js:20
During: ["hello", "12"] main.js:22
Finaly: ["hello", "12"] main.js:25
这里最大的问题是：
- 为什么在 promise resolve 期间会重新执行控制器功能？
- 我怎样才能阻止这种情况发生？
[编辑]
根据要求；HTML（原样）：
<div class="jumbotron" ng-controller='MainCtrl as main'>
<h1>'Allo, 'Allo!</h1>
<p class="lead">
<img src="images/yeoman.png" alt="I'm Yeoman"><br>
Always a pleasure scaffolding your apps.
</p>
<p><a class="btn btn-lg btn-success" ng-href="#" ng-click="main.scrappy()">Splendid!<span class="glyphicon glyphicon-ok"></span></a></p>
</div>
顺便说一句：这是 yeoman 生成的，使用routeProvider
[/编辑]