在事件回调中更新模型时更新模型属性对视图没有影响,有什么想法可以解决这个问题吗？
这是我的服务:
angular.service('Channel', function() {
var channel = null;
return {
init: function(channelId, clientId) {
var that = this;
channel = new goog.appengine.Channel(channelId);
var socket = channel.open();
socket.onmessage = function(msg) {
var args = eval(msg.data);
that.publish(args[0], args[1]);
};
}
};
});
publish() 功能是在控制器中动态添加的.
控制器:
App.Controllers.ParticipantsController = function($xhr, $channel) {
var self = this;
self.participants = [];
// here publish function is added to service
mediator.installTo($channel);
// subscribe was also added with publish
$channel.subscribe('+p', function(name) {
self.add(name);
});
self.add = function(name) …在角度,我有一个对象将通过服务暴露在我的应用程序中.
该对象上的某些字段是动态的,并且将通过使用该服务的控制器中的绑定正常更新.但是一些字段是计算属性,取决于其他字段,需要动态更新.
这里有一个简单的例子(这是工作在jsbin 这里).我的服务模型公开领域a,b并c在那里c通过以下公式计算a + B在calcC().请注意,在我的实际应用程序中,计算要复杂得多,但实质内容就在这里.
我能想到让它工作的唯一方法是将我的服务模型绑定到$rootScope,然后$rootScope.$watch用来监视任何控制器更改a或b何时更改,重新计算c.但这看起来很难看.有没有更好的方法呢？
第二个问题是表现.在我的整个应用程序a和b是对象的大名单,其中获得合计下来c.这意味着$rootScope.$watch函数将进行大量深度数组检查,这听起来会损害性能.
我在BackBone中采用了一种平衡的方法,尽可能地减少了重新计算,但角度似乎并不适合采用一种方法.对此的任何想法都会很棒.
这是示例应用程序.
var myModule = angular.module('myModule', []);
//A service providing a model available to multiple controllers
myModule.factory('aModel', function($rootScope) {
var myModel = {
a: 10,
b: 10,
c: null
};
//compute c from a and b
calcC = function() …我有2个控制器.第一个获取所选项目,第二个获取可用项目.
如何显示新选择的项目？
每个可用项下面的按钮都有一个ng-click,它调用一个名为updateItem的服务,我希望更新发生.
我一直在努力这一点,任何帮助都非常感谢.-谢谢
<div ng-controller="seletedItemCtrl">
<p><i>I want to update this item</i></p>
<div ng-repeat="item in selectedItems">
<ul>
<li>{{item.color}}</li>
<li>{{item.Distance}}</li>
<li>{{item.height}}</li>
<li>{{item.name}}</li>
<li>{{item.year}}</li>
</ul>
</div>
</div >
///////////////////////////////////////////////////
<div ng-controller="availableItemsCtrl">
<div ng-repeat="item in availableItems">
<ul>
<li>{{item.color}}</li>
<li>{{item.Distance}}</li>
<li>{{item.height}}</li>
<li>{{item.name}}</li>
<li>{{item.year}}</li>
</ul>
<button ng-click = 'updateItem()' >select item</button>
</div>
</div>
JS
var app = angular.module('myApp', []);
function availableItemsCtrl($rootScope, $scope){
$scope.availableItems = {
"Items": {
"Item": {
"Group1": [
{
"color": "White",
"Distance": "NA",
"height": "3ft",
"name": "Underlift",
"year": "1955"
},
{ …我目前正在评估AngularJS作为潜在的MVC框架.我想知道实施以下方案的"正确"方法是什么 -
假设我正在设计用户详细信息页面.它被分解为不同的选项卡,如基本信息选项卡(名称,电子邮件...),用户兴趣选项卡(体育,音乐等下拉菜单)等.
所以代码看起来像这样:
<!-- main.html-->
<div ng-controller="UserController">
<div ng-switch on="renderPath">
<div ng-switch-when="basicInfo">
<div ng-include src="basicUrl"></div>
</div>
<div ng-switch-when="interests">
<div ng-include src="interestUrl"></div>
</div>
</div>
</div>
和interests.html看起来像
<div>
<div class="dropdown">
<a class="dropdown-toggle" id="dLabel" role="button" data-toggle="dropdown" data-target="#" href="/page.html">
I like to play:
</a>
<ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
<li ng-repeat="sport in sports">{{sport}}</li>
</ul>
<a class="dropdown-toggle" id="A1" role="button" data-toggle="dropdown" data-target="#" href="/page.html">
I like to listen to:
</a>
<ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
<li ng-repeat="genre in genres">{{genre}}</li>
</ul>
</div>
</div>
所以问题是,除了UserController之外,我应该为" basicInfo …