【问题标题】：AngularJS, passing data to a stateProvider OnEnter function to populate a modalAngularJS，将数据传递给 stateProvider OnEnter 函数以填充模式
【发布时间】：2014-09-17 18:16:39
【问题描述】：

不确定这是否可能，但我似乎无法让它工作。

基本前提

我想让用户点击表格中的 EDIT 按钮以打开一个模式，该模式填充了所点击行的内容。

方法

我想在不使用 URL 参数的情况下执行此操作。填充表格的 API 响应已经提供了填充模式所需的一切，那么为什么在 URL 中传递 :ID 只是为了再次调用 API 以再次获取必要的数据？

这是我的表格，用户可以单击它来启动该过程。

<tbody>
  <tr ng-repeat="item in accounts">
    <td><span class="label label-success">Active</span></td>
    <td>{{item.login}}</td>
    <td>{{item.full_name}}</td>
    <td>{{item.member_since}}</td>
    <td>Daily</td>
    <td><a ng-click="showLinks(item)" class="btn btn-warning">LINKS</a></td>
    <td><a ng-click="editAccount(item)" class="btn btn-primary">EDIT</a></td>
    <td><a ng-click="deleteAccount(item)" class="btn btn-danger">DELETE</a></td>
  </tr>
</tbody>

在我的控制器中，我有以下内容。

$scope.editAccount = function (item) {
  console.log("Editing Account"); 
  console.log(item); 
  $state.go('edit', item);
}

控制台正确打印出对象。在这一点上一切都很好。我想此时将这个选定的项目传递给 stateProvider，以便它可以在 onEnter 函数中填充模态。

请注意，我已注释掉“return {login: 'TEST'}”。如果我把它留在里面，模式会正确填充。

$stateProvider.state('edit', {
    url: '/edit',
    onEnter: function($stateParams, $state, $modal) {
        console.log("Enter Edit");

        $modal.open({
            templateUrl: "views/account_edit.htm",
            //params: ['login'],
            resolve: {
                item: function() {
                    console.log("Resolving Edit");
                    console.log($stateParams);
                    console.log($state.params);
                    console.log(this);
                    //return {login:"TEST"};
                }
            },
            controller: ['$scope', 'item', function($scope, item) {
                console.log("Controlling Edit");
                $scope.item = item;
                    
                $scope.cancel = function() {
                    $scope.$close(true);
                };

                $scope.ok = function() {
                    $scope.$close(true);
                    };
                }]
            }).result.then(function(result) {
                if (result) {
                    console.log("Acting on RESULT");
                    return $state.go("home");
                }
            });
        }
    });

我似乎无法开始工作的是如何从 $stateProvider 中访问 $stage.go 中传递的 ITEM。谁有想法？下面的文档表明我应该能够看到 $stateParams 中的数据，但它不存在

去（到，参数，选项）

params(optional) – {object=} – 将发送到状态的参数映射，将填充 $stateParams。任何未指定的参数都将从当前定义的参数继承。例如，这允许进入共享父状态中指定的参数的兄弟状态。参数继承仅适用于共同的祖先状态，即过渡到兄弟姐妹将为您获取所有父母的参数，过渡到孩子将为您获取所有当前参数，等等。

**更新

我发现完成这项工作的唯一方法是进行以下更新。

   $scope.editAccount = function (item) {
        console.log("Editing Account"); 
        console.log(item);
        $state.params.item = item;
        //$state.go('edit', item);
        $state.go('edit');
    };


    resolve: {
        item: function() {
            return $state.params.item;
        }
    },

【问题讨论】：

标签： angularjs parameters modal-dialog angular-ui-router

【解决方案1】：

要将参数传递给状态，您需要在状态的 url 选项中定义此参数。如果你不想要，你可以在 params 选项中定义 params：

$stateProvider.state('edit', {
    url: '/edit',
    params: {
        login: null,
        full_name: null,
        member_since: null
    },
    onEnter: function($stateParams, $state, $modal) {
        // ...
    }
});

【讨论】：