【问题标题】:AngularJs - getting undefined object when passing parameters through ui-srefAngularJs - 通过ui-sref传递参数时获取未定义的对象
【发布时间】:2016-10-27 06:55:06
【问题描述】:

您好,我对 angularjs 很陌生,这是我的代码

html

<table ng-table="tctrl.tableEdit" class="table table-striped table-vmiddle" show-filter="true">
  <tr ng-repeat="w in $data"  ng-class="{ 'active': w.$edit }">
    <td data-title="'Company name'" filter="{ 'cl_company_name': 'text' }" sortable="'cl_company_name'">
      <a ui-sref="clients.client-detail({ clientId: w.cl_id })"><span ng-if="!w.$edit">{{ w.cl_company_name }}</span></a>
      <div ng-if="w.$edit"><input class="form-control" type="text" ng-model="w.cl_company_name" /></div>
    </td>
  </tr>
</table>

controller.js

.controller('TabsClientCtrl', function ($scope, $window, $stateParams) {

   $scope.clID = $stateParams.clientId
   alert($scope.clID)
})

state.js

.state ('clients', {
    url: '/clients',
    templateUrl: 'views/common.html'
})

.state('clients.client-detail', {
    url: '/client-detail',
    templateUrl: 'views/client-detail.html',
    resolve: {
         ...
    }
})

当我点击 td 中的公司名称时,我收到未定义的警报。这是使用 ui-sref 传递参数的正确方法吗?

【问题讨论】:

  • 您在w 中有什么,并将您的状态配置添加到问题中。
  • 是的,你有问题,请检查我的回答

标签: javascript jquery angularjs angular-ui-bootstrap


【解决方案1】:

你的路线有两件事要改变,

1) 给路由url添加id参数

url: '/client-detail/:clientId',

这个:clientId 需要告诉ui-router 你正在通过路由发送一些参数。

2) 添加控制器:

controller: 'TabsClientCtrl

控制器是必需的,因为您在该控制器中使用这些参数。

.state ('clients', {
    url: '/clients',
    templateUrl: 'views/common.html'
})

.state('clients.client-detail', {
    url: '/client-detail/:clientId',
    templateUrl: 'views/client-detail.html',
    controller: 'TabsClientCtrl,
    resolve: {
         ...
    }
})

【讨论】:

  • 但是你需要这个控件,还是你在视图中给了它?
  • 是的,它在视图中。
  • 好的,如果在视图中,路由中不需要控制器。
【解决方案2】:

请更改路线到

.state('clients.client-detail', {
    url: '/client-detail/?clientId',
    templateUrl: 'views/client-detail.html',
    resolve: {
         ...
    }
})

.state('clients.client-detail', {
    url: '/client-detail/:clientId',
    templateUrl: 'views/client-detail.html',
    resolve: {
         ...
    }
})

根据您的要求

【讨论】:

  • 你能告诉我两者的区别吗?
  • 当使用第一种方法时,“clientId”是可选的。对于第二种方法,“clientId”应与 URL 连接
  • 好的,知道了。谢谢! @Vinoth Rajendran
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2019-09-06
  • 1970-01-01
  • 2018-12-20
  • 1970-01-01
  • 1970-01-01
  • 2011-11-06
  • 1970-01-01
相关资源
最近更新 更多