【问题标题】:AngularJS: Unable to inject viewsAngularJS:无法注入视图
【发布时间】:2016-03-18 09:57:01
【问题描述】:

<!DOCTYPE html>
<html lang="en" ng-app="contactsMgr">
<head>
    <meta charset="utf-8">
    <title>Contacts Manager</title>
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <script type="text/javascript" src="js/jquery.min.js"></script>
    <script type="text/javascript" src="js/bootstrap.min.js"></script>
    <script type="text/javascript" src="js/angular.min.js"></script>
    <script type="text/javascript" src="js/angular-route.min.js"></script>
    <script type="text/javascript" src="js/script.js"></script>
</head>
<body>

<nav class="navbar navbar-default" role="navigation">
    <div class="navbar-header">
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#nav-toggle">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
        </button>
        <a class="navbar-brand" href="/">Contacts Manager</a>
    </div>

    <div class="collapse navbar-collapse" id="nav-toggle">
        <ul class="nav navbar-nav">
            <li class="active"><a href="/">Browse</a></li>
            <li><a href="#/add-contact">Add Contact</a></li>
        </ul>
        <form class="navbar-form navbar-right" role="search">
            <input type="text" class="form-control" placeholder="Search">
        </form>
    </div>
</nav>

<div class="container">

    <ng-view></ng-view>

</div>

</body>
</html>

angular.module('contactsMgr', ['ngRoute'])

    /*-----------------------------------
     | Routes
     ------------------------------------*/

    .config(function($routeProvider, $locationProvider){

        $routeProvider
            .when('/', {
                controller: 'indexCtrl',
                templateUrl: '../assets/partials/index.html'
            })

            .when('/add-contact', {
                controller: 'addCtrl',
                templateUrl: '../assets/partials/add.html'
            })


            .when('/contact/:id', {
                controller: 'contactCtrl',
                templateUrl: '../assets/partials/contact.html'
            })

            .otherwise({
                redirectTo: '/'
            });

        $locationProvider.html5Mode(true);

    })



    /*-----------------------------------
     | Index Controller
     ------------------------------------*/

    .controller('indexCtrl', function($scope){

    })

    /*-----------------------------------
     | Add Controller
     ------------------------------------*/

    .controller('addCtrl', function($scope){

    })

    /*-----------------------------------
     | Contact Controller
     ------------------------------------*/

    .controller('contactCtrl', function($scope, $routeParams){

        console.log($routeParams);

    })

【问题讨论】:

  • 这段代码对你有用吗?
  • 顺便说一句,它对我不起作用。不过还是谢谢

标签: angularjs views


【解决方案1】:
Dont use / in the href tag for you instead use like the below code

<a href="#showOrders">show order</a>

如果你想要一个正确的答案,还有一件事。清楚地解释你的成就而不是形象。作为代码

【讨论】:

  • 您好,感谢您的回答。我会更具体,因为它没有解决问题:我有一个名为 index.html 的主文件。正如您从图片中看到的,我在导航栏上有三个按钮。我已经使用 ngRoute 构建了路由。我也构建了相关的控制器。我将通过代码:
  • 我刚刚添加了两个 sn-ps。基本上它让我发疯,因为当我点击“添加联系人”按钮时,我希望 add.html 页面与表单一起显示。不幸的是,什么也没有发生。提前致谢
  • 添加这样的代码添加联系人
  • 它不工作。不知道该怎么办。您需要更多信息吗?
  • 是的,你可以粘贴到 pastebin 并分享代码,这样我会告诉你为什么它不工作的确切答案.. 检查模板 url。不要放 .. 在此之前添加 assets/partials/index.html
猜你喜欢
  • 2013-08-08
  • 1970-01-01
  • 1970-01-01
  • 2015-09-28
  • 2018-10-16
  • 2017-06-14
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多