在 Angular js 中路由页面

费萨尔扬胡亚

处理简单的测试应用程序,这让我非常生气,为什么它不路由页面对我来说似乎一切都很好,但是我看不到关于页面和联系页面

<ul class="nav navbar-nav navbar-right">
  <li><a href="#"> Home</a></li>
  <li><a href="#about">About</a></li>
  <li><a href="#contact">Contact</a></li>
</ul>
<div id="main">
  <div ng-view></div>
</div>
<script src="/node_modules/angular/angular.js"></script>
<script src="/node_modules/angular-route/angular-route.js"></script>
<script src="js/app.min.js"></script>

** app.js**

(function () {
    var app = angular.module('fjapp', ['ngRoute']);

    app.config(function ($routeProvider) {
        $routeProvider
            .when('/', {
                templateUrl: 'pages/home.html',
                controller: 'homeController'
            })
            .when('/about', {
                templateUrl: 'pages/about.htm',
                controller: 'aboutControler'
            })
            .when('/contact', {
                templateUrl: 'pages/contact.html',
                controller: 'contactController'
            });
    });

    app.controller('homeController', ['$scope', function ($scope) {
        $scope.message = "Welcome to the home page";
    }]);

    app.controller('aboutController',['$scope', function($scope){
        $scope.message = "Ok, now you are in About page";
    }]);

    app.controller('contactController',['$scope',function($scope){
        $scope.message = "Here find all the contact information";
    }]); 
})();

我缺少什么..

乔苏·马丁内斯

你缺少/a标签。它应该是这样的:

<li><a href="#/about">About</a></li>
<li><a href="#/contact">Contact</a></li>

更新

包括$locationProvider.hashPrefix('');到您的app.config. 这是一个工作的plunker

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

如何在angular2中路由不同的组件或页面

来自分类Dev

在Express.js中路由

来自分类Dev

页面被重新加载而不是在shopify下一个js应用中路由

来自分类Dev

可以在 Angular 中路由之前使用查询参数记录路由

来自分类Dev

在Rails中路由静态页面

来自分类Dev

Angular JS UI路由

来自分类Dev

用angular js路由

来自分类Dev

Angular JS 1.6 路由

来自分类Dev

Angular JS 多级路由

来自分类Dev

Sails JS + Angular JS:路由

来自分类Dev

Sails JS + Angular JS:路由

来自分类Dev

使用Dart在angular2中路由

来自分类Dev

在 Angular 中路由后,查询参数在 URL 中得到修改

来自分类Dev

Angular JS-UI路由器页面重新加载不会设置状态

来自分类Dev

Theatre.js无法在加载了Angular ui路由的页面上工作

来自分类Dev

Angular.js:prettyPhoto URL重定向到角度路由中提到的默认页面

来自分类Dev

Angular JS中的路由错误

来自分类Dev

Angular.js路由问题

来自分类Dev

Angular JS路由使无限循环

来自分类Dev

了解 Angular JS 中的路由

来自分类Dev

Angular路由中的动态页面

来自分类Dev

Angular默认页面路由

来自分类Dev

AngularJS HTML模板在Node.js / Express.js中路由失败

来自分类Dev

路由到Angular中的非Angular页面

来自分类Dev

Angular.js路由与Backbone.js路由

来自分类Dev

为什么内容被填充为angular2中路由器出口的同级

来自分类Dev

我们可以在 Angular 4 中路由时发送对象吗

来自分类Dev

Angular JS-UI路由-脚本始终向下滚动到注入,但是我希望他们看到整个页面?

来自分类Dev

Express.js中路由参数的正则表达式