我用UI-Router路由.当我将路径从状态更改为另一个状态并返回到相同状态时,我看到状态中存在旧的$ scope (具有它的属性).
我想在状态改变之前销毁那个$ scope,所以当我第二次回到状态时,会有一个干净的新范围.我试图在这个事件中访问范围:
$rootScope.$on('$stateChangeStart',
function(event, toState, toParams, fromState, fromParams) {
// fromState.$scope.$destroy();
});
但是没有任何关于$ scope的参考.我可以在角度改变状态之前访问范围UI-Router吗？
我得到以下代码:
<div class="map" ng-controller="DealerMarkerListCtrl">
<a ng-click="showdetails=!showdetails" href="#/dealer/{{marker.id}}" class="marker" style="left:{{marker.left}}px;top:{{marker.top}}px" ng-repeat="marker in dealer"></a>
</div>
而这个观点:
<div ng-show="showdetails" class="alldealermodal">
<div ng-view></div>
</div>
这个相同的"ng-show"东西只能在ng-repeat之外的一个链接上正常工作,但是在这个ng-repeat中它不起作用.
链接应打开叠加层.ng-view也有效.
我错过了什么？
我坚持从指令到控制器的双向数据绑定.指令是ng-repeat.尝试了几件事,但无法获得指令范围变量反映在控制器中.
angular.module("myApp", [])
.controller("Ctrl1", function ($scope) {
$scope.crossTabs = [1,2,3,4,5];
})
.directive("crossTab", function () {
return {
restrict: "E",
template: "<input type='text' ng-model='crossTab'/><button ng-click='changeLols()' id='clc'>change crossTabs</button>",
scope: {
crossTabs: '=',
crossTab: '='
},
controller: function($scope){
$scope.changeLols = function(){
// The below comment line is not working. It doesnt change anything. But the one uncommented which pushes an element updates the controllers 'crossTabs' variable as well.
//$scope.crossTabs = [3,4,5];
$scope.crossTabs.push(6);
}
},
link: function (scope, elem, attrs) {
}
}
}); …虽然看起来像一个简单的问题但很难解决.有一个分页组件,有一个按钮和一个下拉列表.用户可以通过单击按钮或在下拉列表中选择该页码来转到页面.
问题是,当我在下拉列表中选择一个值时,没有任何反应.因为范围变量与前一个变量没有变化.
ASPX:
<div data-ng-app="app" data-ng-controller="ReportsCtrl">
<div id="paging-top">
<div>
<ul>
<li>
<select data-ng-model="SelectedPage" data-ng-change="ShowSelectedPage();"
data-ng-options="num for num in PageNumbers track by num">
</select>
</li>
<li data-ng-click="ShowNextPage();"><a href="#">Next</a></li>
</ul>
</div>
</div>
app.js
var app = angular.module("app", ["ngRoute"]);
ReportsCtrl.js
app.controller("ReportsCtrl", ["$scope","ReportsFactory",function ($scope,ReportsFactory) {
init();
var init = function () {
$scope.ShowReport(1);
}
$scope.ShowReport = function (pageNumber) {
GetUserResponsesReport(pageNumber);
}
function GetUserResponsesReport(pageNumber) {
$scope.UserResponsesReport = [];
var promise = ReportsFactory.GetReport();
promise.then(function (success) {
if (success.data != null && success.data != '') {
$scope.UserResponsesReport …我想知道为什么在此示例中每次输入不能输入多个字符：
<div ng-app>
<div ng-controller="ctrl">
<table>
<tr>
<td ng-repeat="f in foo">
<input ng-model="foo[$index]" style="width:60px" ></input>
</td>
</tr>
</table>
</div>
</div>
js:
function ctrl($scope) {
$scope.foo = [];
for (var i=0; i<5; i++) {
$scope.foo.push('');
}
}
为了清理我的部分内容,我最近将一些全局菜单移动到单独的模板中,现在我将其包含在需要它们的视图中.由于菜单(包括搜索栏)是全局的,我创建了一个跟踪菜单状态等的服务.
在我开始包括之后,问题就变得有趣了.
视图的HTML(翡翠)
div(ng-controller='HeroUnitCtrl', ng-include src='heroTemplate')
div(ng-controller='MainSearchBarCtrl', ng-include src='searchBarTemplate')
div.row-fluid
div.span12
table.table.table-striped.table-bordered
tr
th
a(ng-click='setOrder("id")') ID#
th
a(ng-click='setOrder("client.name")') Kunde
th
a(ng-click='setOrder("technician.name")') Tekniker
th
a(ng-click='setOrder("createdAt")') Opprettet
th
a(ng-click='setOrder("statusString")') Status
tr(ng-repeat='record in records | orderBy:orderProp | filter:searchBar')
td
a(ng-href='#/records/show/{{record.id}}') {{record.id}}
td {{record.client.name}}
td {{record.technician.name}}
td {{record.createdAt}}
td {{record.statusString}}
HTML(Jade)searchBarTemplate
input#searchField.input-xxlarge(type='text', placeholder='placeholder', ng-change='searchBarUpdated()', ng-model='searchBar')
现在到了我真的不明白,
MainSearchBarCtrl
function MainSearchBarCtrl(MainSearchBarService, $scope, $location) {
$scope.searchBarTemplate = 'partials/main-searchbar';
$scope.searchBar = 'Hello World!';
$scope.searchBarUpdated = function() {
console.log('Search bar update: ' + $scope.searchBar);
MainSearchBarService.searchBarUpdated($scope.searchBar);
}
}
最初,searchBar …
目标是创造这个
<h3>11.4.2013</h3>
<ul>
<li>entry 1</li>
<li>entry 2</li>
<li>entry 3</li>
</ul>
<h3>10.4.2013</h3>
<ul>
<li>entry 4</li>
<li>entry 5</li>
<li>entry 6</li>
</ul>
由此
[
{
"name": "entry1",
"date": "11.4.2013"
},
{
"name": "entry2",
"date": "11.4.2013"
},
{
"name": "entry3",
"date": "11.4.2013"
},
{
"name": "entry4",
"date": "10.4.2013"
},
{
"name": "entry5",
"date": "10.4.2013"
},
{
"name": "entry6",
"date": "10.4.2013"
}
]
问题是ng-repeat必须打开,li所以我永远不能用ng-repeat做到这一点,是吗？我发现这个来自Mark Rajnoc的http://jsfiddle.net/mrajcok/CvKNc/示例,但它仍然非常有限......
我还有其他选择吗？写我自己的ng-repeat like指令？或者还有其他方法可以不写一个吗？
我是angularjs的新手.我正在努力学习$watch财产.这是我的plunker.
rootScope.$watch属性仅在页面加载时执行,而不在文本更改事件上执行.但它适用于$scope.$watch.
我在不同的地方读过,你总是在你的范围内使用对象很重要,但我还没有找到关于它为什么的明确答案.有人可以帮帮我吗？