在没有 url 帮助的情况下在控制器之间传递数据
Passing data in between controller without help of url?
我正在使用AngularJS创建两页Webapp。我的 Json 文件是:
{
"data": [
{ "name": "bhav",
"id": 123
},
{"name": "bhavi",
"id": 1234
},
{"name": "bhavk",
"id": 1235
}
]
}
我的应用.js(路由文件是):
myApp = angular.module('myApp', ['slickCarousel',
'ngRoute',
'myAppControllers',
'myAppServices','swipeLi'
]);
myApp.config(['$routeProvider',
function($routeProvider) {
$routeProvider.
when('/', {
templateUrl: 'partials/home-page.html',
controller: 'ProfileListCtrl',
}).
when('/profile/:typeofprofile', {
templateUrl: 'partials/profile-detail.html',
controller: 'ProfileDetailCtrl'
})
}]);
我的第 1 页(主页.html)是给定的格式:
<div ng-repeat="data in data">
<a href="profile/myfriend">{{data.name}}</a>
</div>
和第二页(个人资料详情.html)考虑到我正在使用 http.get 请求从控制器中的 Json 文件中提取数据,我想要该配置文件的 ID 号。
因此,请帮助我获取点击的个人资料的ID或名称,而无需通过URL。
注意:我已经查看了ui路由链接:Angular UI路由器在没有URL的状态之间传递数据,但我没有得到。
正如您在评论中所述,您希望使用$state.go()
来传递数据。使用 $state.go()
传递参数也非常简单。您需要在应用程序中注入ui.router
。我创建了 2 个部分视图来显示参数的传递,其中参数从 header.html
传递到 side.html
.
您的JS将如下所示:
var app = angular.module('nested', ['ui.router']);
app.config(function($stateProvider,$locationProvider, $urlRouterProvider) {
$urlRouterProvider.otherwise("/");
$stateProvider.state('top', {
url: "",
templateUrl: "header.html",
controller: 'topCtrl'
})
.state('top.side', {
url: '/app/:obj/:name',
templateUrl: "side.html",
controller: 'filterCtrl'
})
});
app.controller('topCtrl', function($scope,$state) {
$scope.goItem = function(){
$state.go('top.side',{obj:441,name:'alex'});
};
});
app.controller('filterCtrl', function($scope,$state) {
console.log(JSON.stringify($state.params));
$scope.params = $state.params;
});
这是工作PLUNKER,您可以在其中找到有关views
,controller
和script
需要做的事情:
http://plnkr.co/edit/M1QEYrmNcwTeFd6FtC4t?p=preview
我提供了使用 ui-sref
和 $state.go()
传递$stateParams
的方法。但是,如果要在所有控制器之间共享数据。请参阅我在这个问题中的回答:
在 AngularJs 中共享数据
相关文章:
- 函数参数中的数据与指定变量之间的任何性能差异
- 在控制器和数据对象之间同步数据
- 使用服务(AngularJS)在控制器之间共享数据
- AngularJS中的页面之间共享数据返回空
- 通过共享服务在两个不同ng应用程序中的控制器之间共享数据
- Mongoose查询在两个日期时间之间提取数据
- 使用Angularjs在两个不同页面的控制器之间共享数据
- 使用JavaScript在网页之间进行数据传输
- 如何在网页之间存储数据
- 如何在Windows Phone 8.1应用程序中在C#和Javascript之间传递数据或通信
- 2ng控制器,并且需要在控制器之间共享数据
- 在控制器angular js之间共享数据
- 如何将json文件中的数据提取到对象数组中,并在两个控制器之间共享
- 基本html页面和弹出窗口之间的数据交换
- Meteor-在助手、事件和模板之间传递数据
- 如何在 Angularjs 中的交叉模块之间共享数据
- 在OnsenUI+AngularJS+PhoneGap中的控制器之间传递数据
- 最小化在javascript中客户端/服务器之间发送的数据
- 如果我在页面之间移动,Jquery 数据表行事件会卡住
- JavaScript:显示客户端和服务器之间数据传输的度量