ui-sref没有生成href

时间:2015-12-29 21:22:11

标签: angularjs angular-ui-router

我不确定我在这里做的错误是什么,但是href没有产生。我已经按照ui-router示例进行了配置,但是当我将ui-sref放入ng-repeat时它不生成URL,而且当我手动输入URL时它也无法正常工作。

即使我绑定设置值data-ng-click="widget.open({widgetId: 1})也没有任何反应。

这是我的代码段。

配置:

.config(['$stateProvider', '$urlRouterProvider', '$locationProvider',
        function ($stateProvider, $urlRouterProvider, $locationProvider) {

            $urlRouterProvider.otherwise('/');

            $locationProvider.html5Mode(true);

            $stateProvider
                .state('home', {
                    url: '/',
                    templateUrl: '/templates/home/home.html'
                })
                .state('widget', {
                    // With abstract set to true, that means this state can not be explicitly activated.
                    // It can only be implicitly activated by activating one of its children.
                    abstract: true,
                    // This abstract state will prepend '/widgets' onto the urls of all its children.
                    url: '/widget',
                    // Loading a template from a file. This is also a top level state,
                    // so this template file will be loaded and then inserted into the ui-view
                    // within index.html.
                    templateUrl: '/templates/widgets/index.html'
                })
                .state('widget.open', {
                    url: '/{widgetId:[\w+$]}', //matches  [a-zA-Z_0-9]
                    templateUrl: '/templates/widgets/index.html'
                })
                .state('widget.create', {
                    url: '/{type:[a-zA-Z]}', // We can test enum list also
                    templateUrl: '/templates/widgets/index.html'
                })
                .state('mashup', {
                    // With abstract set to true, that means this state can not be explicitly activated.
                    // It can only be implicitly activated by activating one of its children.
                    abstract: true,
                    // This abstract state will prepend '/mashups' onto the urls of all its children.
                    url: '/mashup',
                    // Loading a template from a file. This is also a top level state,
                    // so this template file will be loaded and then inserted into the ui-view
                    // within index.html.
                    templateUrl: '/templates/mashups/index.html'
                })
                .state('mashup.open', {
                    url: '/{mashupId:[\w+$]}', //matches  [a-zA-Z_0-9]
                    templateUrl: '/templates/mashups/index.html'
                })
                .state('mashup.create', {
                    url: '/{templateType:[a-zA-Z]}', // We can test enum list also
                    templateUrl: '/templates/mashups/index.html'
                });
        }])

模板:

    <div class="panel panel-default widget-list">
      <div class="panel-heading">
        <h3 class="panel-title">My Widgets ({{widgets.length}})</h3>
      </div>
      <div class="panel-body hp-content">
        <table class="table table-condensed table-bordered">
          <tbody>
          <tr data-ng-repeat="w in widgets">
            <td class="hp-type">Icon</td>
            <td>
              <div class="row">
                <div class="col-xs-12">
                  <a data-ui-sref="widget.open({widgetId: w.id })">{{::w.name}}</a>    
                </div>
              </div>
              <div class="row">
                <div class="col-xs-12 col-md-6">
                  {{::w.sourceId}}
                </div>
                <div class="col-xs-12 col-md-6">
                  {{::w.communityId}}
                </div>
              </div>
            </td>
            <td class="hp-actions">{{::w.access}}</td>
          </tr>
          </tbody>
        </table>
      </div>
      <div class="panel-footer">Panel footer</div>
    </div>

Update: compiled template 有人可以指出我正在做的错误吗?

由于

2 个答案:

答案 0 :(得分:0)

无需将widget.id包裹在花括号中:

data-ui-sref="widget.open({widgetId: {{widget.id}} })

使用:

data-ui-sref="widget.open({widgetId: widget.id })">

答案 1 :(得分:0)

我认为您的问题是一个命名问题。你在widget in widgets的转发器中,所以当你执行widget.open时,我认为它在转发器的widget对象中寻找一个open函数而不是子路径'widget.open'。