我是 angular JS 的新手。我使用 ngRoute 创建了一个简单的页面。
在第一个视图中,我有一个表,并在点击它时重定向到第二个视图。
但是我使用ng-click
调用了两个函数,changeView
函数运行正常。但是第二个函数无法在第二个视图上执行。
但如果在第一个视图上使用它,它的运行正常
下面是第一个视图的代码
的 Angular.php
<div ng-app="myApp" ng-controller="dataCtr">
<table class='table table-striped'>
<thead>
<tr>
<td>Title</td>
<td>Stream</td>
<td>Price</td>
</tr>
</thead>
<tbody>
<tr ng-repeat = "x in names | filter:filtr | filter:search" ng-click=" disp(x.id);changeView()">
<td >{{ x.Title }}</td>
<td>{{ x.Stream }}</td>
<td>{{ x.Price }}</td>
</tr>
</tbody>
</table>
</div>
继承人的第二个观点 的 details.php :
<div ng-app="myApp" ng-controller="dataCtr">
<div class="container">
SELECTED:<input type="textfield" ng-model="stxt">
</div>
</div>
继承人 js档案:
var app = angular.module("myApp", ['ngRoute']);
app.config(function($routeProvider) {
$routeProvider
.when('/angular', {
templateUrl: 'angular.php',
controller: 'dataCtr'
})
.when('/details', {
templateUrl: 'details.php',
controller: 'dataCtr'
})
.otherwise({
redirectTo: '/angular'
});
});
app.controller('dataCtr', function($scope ,$http ,$location ,$route ,$routeParams) {
$http({
method: "GET",
url: "json.php"})
.success(function (response) {$scope.names = response;});
$scope.changeView = function()
{
$location.url('/details');
};
$scope.disp = function(id)
{
$scope.stxt = $scope.names[id-1].Title;
};
});
disp
函数在角度视图上正常工作。但不是在第二个视图上路由。我认为在ng click中调用两个视图的语法是正确的。或者,如果有任何其他方法将关联的表格单元格值调用到第二个视图。请帮助。
答案 0 :(得分:1)
经过大量研究后,我发现了它。我使用了工厂服务
app.factory('Scopes', function ($rootScope) {
var mem = {};
return {
store: function (key, value) {
$rootScope.$emit('scope.stored', key);
mem[key] = value;
},
get: function (key) {
return mem[key];
}
};
});
将此添加到JS。 因为范围在第二个控制器上丢失,所以服务帮助我们保留范围值并在不同的控制器中使用它们。从第一个控制器存储范围
app.controller('dataCtr', function($scope ,$http ,$location,$rootScope,Scopes) {
Scopes.store('dataCtr', $scope);
//code
});
并加载到借调的控制器中。
app.controller('dataCtr2', function($scope ,$timeout,$rootScope,Scopes){
$scope.stxt = Scopes.get('dataCtr').disp;
});
答案 1 :(得分:0)
第二个视图无效,因为您无法使用$ scope。$ apply()方法。 $ apply()用于从角度框架外部以角度执行表达式。$ scope。$ apply()在您更改位置后立即知道事情发生了变化。
更改以下代码部分,再试一次
$location.path('/detail');
$scope.$apply();