【问题标题】:Passing data in between controller without help of url?在没有url帮助的情况下在控制器之间传递数据?
【发布时间】:2016-03-17 21:31:49
【问题描述】:

我正在使用 AngularJS 创建两页 webapp。 我的 Json 文件是:

{
    "data": [

        { "name": "bhav",
"id": 123
            },
{"name": "bhavi",
"id": 1234
},
{"name": "bhavk",
"id": 1235
}
]
}

我的app.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'
      })
}]);

我的第一页(home-page.html)是给定的格式:

<div ng-repeat="data in data">
<a href="profile/myfriend">{{data.name}}</a>
</div>

在第二页(profile-details.html) 考虑到我正在使用 http.get 请求从控制器中的 Json 文件中提取数据,我想要那个 该配置文件的 ID 号

所以请帮我在不通过 URL 的情况下获取点击的配置文件的 ID 或名称。

注意:我已经浏览了 ui-route 链接:Angular ui router passing data between states without URL,但我没明白。

【问题讨论】:

  • 这是错误的&lt;div ng-repeat="data in data"&gt; 你必须给一个不同的名字&lt;div ng-repeat="item in data"&gt;。那么不清楚你在问什么。
  • @d.h.我知道 $routeProvider 的方法,但我们也可以使用 $state.go() 传递数据,如果你能帮助我,那就太好了
  • 使用$stateProvider即$state.go()传递参数,需要注入ui.route,使用$routeProvider是无法实现的
  • 感谢@AlexRumbaNicked,如果你能在 plunker 可以共享数据的地方给我一个简单的例子,那就太好了。我试图使用 ui-route 但无法弄清楚如何使用??
  • 您可以使用 localStorage 或 $routeParams 来存储和检索该特定 id。希望对您有所帮助!

标签: javascript angularjs angularjs-directive angular-ui-router angular-routing


【解决方案1】:

正如您在 cmets 中所说,您想使用 $state.go() 传递您的数据。使用 $state.go() 传递 params 也很简单。您需要在您的应用程序中注入ui.router。我创建了 2 个局部视图来显示参数的传递,其中 paramsheader.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,您可以在其中找到有关viewscontrollerscript 的操作:

http://plnkr.co/edit/M1QEYrmNcwTeFd6FtC4t?p=preview

我提供了使用ui-sref$state.go() 传递$stateParams 的方法。但是,如果您想在所有控制器之间共享数据。在这个问题中查看我的答案:
Share Data in AngularJs

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2019-05-22
    • 2012-09-27
    • 1970-01-01
    • 2014-08-10
    • 1970-01-01
    • 1970-01-01
    • 2021-08-29
    • 1970-01-01
    相关资源
    最近更新 更多