Ui-sref 不生成可点击的链接/不工作 [英] Ui-sref not generating clickable links/not working

查看:22
本文介绍了Ui-sref 不生成可点击的链接/不工作的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我之前为此使用过 ng-route 并且效果很好,但是使用 UI Router,链接不再可点击,或者至少大部分时间它们都不可点击.当它们出现时,这是非常随机的,它们不会显示我正在使用的 html 模板.

I used ng-route for this before and it worked fine, but with UI Router, the links are not clickable anymore, or at least most of the time they aren't. When they are, which is very random, they don't display the html templates I'm using.

HTML:

<head>
    <title>Tutorial</title>

    <script src="lib/angular/angular.js"></script>
    <script src="lib/angular/angular-ui-router.min.js"></script>
    <script src="js/app.js"></script>
    <script src="js/controllers.js"></script>

</head>

<body>

   <ng-view></ng-view>

    <ul class="menu">
        <li><a ui-sref="view1">view1</a></li>
        <li><a ui-sref="view2">view2</a></li>
    </ul>

.js

angular.module('myApp', [
    'myApp.controllers',
    'ui.router'
    ]);

angular.module('myApp').config(function($stateProvider, $urlRouterProvider) {

    $stateProvider.state('view1',{
        url: '/view1',
        controller:'Controller1',
        templateUrl:'/view1.html' 
    }).state('view2', {
        url: '/view2/:firstname/:lastname',
        controller: 'Controller2',
        resolve: {
            names: function() {
                return ['Misko', 'Vojta', 'Brad'];
            }
        },
        templateUrl: '/view2.html'
    });

    $urlRouterProvider.otherwise('/view1');

});


angular.module('myApp.controllers', []).controller('Controller1', function($scope, $location, $state) {

    $scope.loadView2=function() {
        $state.go('view2', {
            firstname: $scope.firstname,
            lastname: $scope.lastname
        });
    };
}).controller('Controller2', function($scope, $stateParams, names) {
    $scope.firstname = $stateParams.firstname;
    $scope.lastname = $stateParams.lastname;
    $scope.names = names;

});

我正在按照有关 AngularJS 的 SitePoint 电子书中的说明进行操作,因此我不确定我做错了什么或错过了什么.

I'm following the instructions in the SitePoint ebook on AngularJS, so I'm not really sure what I'm doing wrong or what I missed.

http://plnkr.co/edit/amh3nZmyB7lC2IQi3DIn

推荐答案

我在你的标记中的任何地方都没有看到 ui-view,所以你的状态视图很可能没有被渲染并且注射.

I don't see a ui-view anywhere in your markup, so your states' views are most likely not being rendered and injected.

您不应该需要 ng-view.一个 ui-view 应该存在于你的主 HTML 文件中.您的顶级状态将在那里呈现并注入.状态可以有子状态,并且具有子状态的状态的每个模板都应该有自己的 ui-view,其中将注入其呈现的子状态.

You should not need ng-view. A single ui-view should exist in your main HTML file. Your top level states will be rendered and injected there. States can have substates, and each template of a state which has a substate should have a ui-view of its own where its rendered substates will be injected.

查看ui-router的自述文件,了解使其工作的基础知识.此外,他们有一个很好的演示应用,它的来源真的对我有帮助了解这个状态路由引擎是关于什么以及如何使用它.

Look through ui-router's readme for the basics of getting it working. Also, they have a good demo app, the source of which really helped me understand what this state routing engine is about and how to use it.

这篇关于Ui-sref 不生成可点击的链接/不工作的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆