标签: angularjs-scope
AngularJS:选择不对模型进行双向绑定
我使用select来显示客户端名称.用户应该能够选择现有客户端,然后更新范围属性:
调节器
初始化"第一选择".
if($scope.clients.length > 0) $scope.existingClient = $scope.clients[0];
视图
<select
id='nm-existing-client-name'
class='form-control input-lg'
ng-model='existingClient'
ng-options="client.name for client in clients">
</select>
existingClient选择菜单更改时,scope属性不会更改.如果没有初始化值(上面的控制器行被删除),则值existingClient将保持未定义.
ng-change当值更改时附加将触发,但模型本身不会更新为新值.
我正在使用AngularJS v1.2.0-rc.3.
推荐指数
解决办法
查看次数
使用Controller As方法访问继承的范围
使用原始方式定义控制器,访问父级的范围相当简单,因为子范围原型继承自其父级.
app.controller("parentCtrl", function($scope){
$scope.name = "Parent";
})
.controller("childCtrl", function($scope){
$scope.childName = "child of " + $scope.name;
});
<div ng-controller="parentCtrl">
{{name}}
<div ng-controller="childCtrl">
{{childName}}
</div>
</div>
Controller-As方法似乎是声明控制器的推荐方法.但是使用Controller-As,上述方法不再适用.
当然,我可以pc.name从View中访问父作用域:
<div ng-controller="parentCtrl as pc">
{{pc.name}}
<div ng-controller="childCtrl as cc">
{{cc.childName}}
</div>
</div>
我确实遇到了一些问题(潜在的意大利面条代码),但这个问题是关于从子控制器访问父作用域.
我能看到这个工作的唯一方法是:
app.controller("parentCtrl", function(){
this.name = "parent";
})
.controller("childCtrl", function($scope){
$scope.pc.name = "child of " + $scope.name;
// or
$scope.$parent.pc.name = "child of " + $scope.name;
// there's no $scope.name
// and no $scope.$parent.name
}); …推荐指数
解决办法
查看次数
替代Angular 2.0中的$ scope
在Angular 2.0中,将没有$scope.
有什么替代方案？如何在组件之间共享数据？该scope选项是否可用于指令？更实际的是,有一种当前的替代品,我可以熟悉吗？
我知道,controller as但我读到控制器也将被淘汰.
Angular团队开始对这场革命感到困惑.
推荐指数
解决办法
查看次数
使用AngularJS中的"scope"从另一个控制器调用控制器的方法
我试图通过使用scope变量调用第一个控制器中的第二个控制器的方法.这是我的第一个控制器中的方法:
$scope.initRestId = function(){
var catapp = document.getElementById('SecondApp');
var catscope = angular.element(catapp).scope();
catscope.rest_id = $scope.user.username;
catscope.getMainCategories();
};
我可以设置值,rest_id但我不能getMainCategories因某种原因打电话.控制台显示此错误:
TypeError:Object#没有方法'getMainCategories'
有没有办法调用上面的方法？
编辑:
我使用以下方法同时加载两个应用程序;
angular.bootstrap(document.getElementById('firstAppID'), ['firstApp']);
angular.bootstrap(document.getElementById('secondAppID'), ['secondApp']);
我绝对可以在这里使用服务,但我想知道是否还有其他选择可以做同样的事情!
推荐指数
解决办法
查看次数
AngularJS从外部访问控制器$ scope
var theApp = angular.module('theApp', []);
var app = angular.module('theApp', ['ui.bootstrap']);
app.controller('MenuSideController', ['$scope','SnazzyService','$modal','$log', function($scope, SnazzyService, $modal, $log) {
$scope.user.zoomlvl = '2';
}]);
我有上面的控制器,它设置了一个$scope我只能从内部访问值.
但我看到的地方,使用下面我将能够访问$scope,但是当我console.log($scope)在$scope.user.zoomlvl它不存在.
我无法弄清楚如何访问MenuSideController$ scope并使用valZoom变量更新它.
var appElement = document.querySelector('[ng-app=theApp]');
var $scope = angular.element(appElement).scope();
console.log($scope);
$scope.$apply(function() {
$scope.user.zoomlvl = valZoom;
});
推荐指数
解决办法
查看次数
Angular JS Scaling&Performance
我们正在为一家银行建立的Angular应用程序冲击性能问题.
不幸的是,显示代码片段是违反合同的行为.无论如何,我可以描述一些正在发生的主要问题,我希望可以推荐最佳实践.
应用结构:
- 基本上,一个巨大的多表单页面.
- 每个表单都是它自己的部分,嵌套控制器和部分深度约为3级.
- 在json对象的集合上重复相同的形式.
- 每个表单都绑定到重复的对象/模型.
- 我们应该支持页面上1-200个表单的任何位置.
如果你看一下时间表.我们花了很多时间在jQuery解析html方法,jQuery重新计算stye方法,GC事件(垃圾收集).我想最小化这些应该可以加快速度.它们都是Angular生命周期的一部分,但可能有更好的方法来避免它们.以下是探查器的一些截图:
最终,随着重复形式的数量超过5,应用程序缓慢.每种形式与其他形式相对无关.我们已经尝试不在表单之间查看任何共享属性.
performance html5 angularjs angularjs-scope angularjs-ng-repeat
推荐指数
解决办法
查看次数
$ scope.$ root和$ rootScope有什么区别？
我在控制器中看到$ scope有$ root,这是什么？它与$ rootScope的不同之处在于可以在控制器中注入？
推荐指数
解决办法
查看次数
检测是否在angularjs ng-change事件中选中或取消选中复选框
我想检查复选框上发生单击时是否已选中或取消选中复选框.
这就是我所拥有的:
<input type="checkbox" ng-model="answers[item.questID]" ng-change="stateChanged()" />
然后在控制器中我有:
$scope.stateChanged = function () {
alert('test');
}
我可以在检查/取消选中时触发警报但是如何检测复选框的状态？我做了一些研究以找到类似的问题,但我无法得到我需要的东西.
谢谢,Laziale
推荐指数
解决办法
查看次数
使用ngRepeat =>不可编辑的输入将输入绑定到基元数组
这是我的问题的演示.
$scope.myNumbers = [10, 20, 30];
<div ng-repeat="num in myNumbers">
<input type="text" ng-model="num">
<div>current scope: {{num}}</div>
</div>
任何人都可以向我解释为什么输入不可编辑/只读？如果按照设计,背后的理由是什么？
更新2/20/2014
看起来这不再是v1.2.0 + Demo的问题.但请记住,虽然用户控件现在可以使用较新的angularJS版本进行编辑,但它是子范围中的num属性,而不是父范围,可以进行修改.换句话说,修改用户控件中的值不会影响数组.myNumbers
推荐指数
解决办法
查看次数
如何$观察由ng-repeat创建的模型的变化？
以这个Plnkr为例.我不知道fooCollection会预先创建多少成员.所以我不知道bar会有多少型号存在.
但我知道它们将成为角度模型,我知道它们将会是什么样的.
我怎么做$watch这些？
我需要这样做,因为我需要在bar模型更改时触发行为.观看fooCollection本身是不够的,$watch听众在bar更改时不会触发.
相关的html:
<body ng-controller="testCtrl">
<div ng-repeat="(fooKey, foo) in fooCollection">
Tell me your name: <input ng-model="foo.bar">
<br />
Hello, my name is {{ foo.bar }}
</div>
<button ng-click="fooCollection.push([])">Add a Namer</button>
</body>
相关JS:
angular
.module('testApp', [])
.controller('testCtrl', function ($scope) {
$scope.fooCollection = [];
$scope.$watch('fooCollection', function (oldValue, newValue) {
if (newValue != oldValue)
console.log(oldValue, newValue);
});
});
推荐指数
解决办法
查看次数
标签 统计
angularjs-scope ×10
angularjs ×9
javascript ×3
angular ×1
checkbox ×1
html5 ×1
jquery ×1
performance ×1