AngularJs错过了明显的

时间:2015-08-11 11:54:58

标签: angularjs

新手到Angular并且遗漏了一些非常明显的东西。我所要做的就是路由一个链接。 主页

<!DOCTYPE html>
<html ng-app="myApp">
<head>
	<title></title>
	<meta charset="utf-8" />

    <script src="../Scripts/angular.min.js"></script>
    <script src="../Scripts/angular-route.min.js"></script>
	
	<script src="../Scripts/application/angular-module.js"></script>
</head>
<body>
    <div ng-controller="navController">
        <a href="/engagement">engagement</a>
        {{message}}
    </div>
	<div ng-view></div>

</body>
</html>

儿童页面

<div ng-controller="engagementController">
    Engagements
</div>

和模块

var myApp = angular.module('myApp', ['ngRoute'])
    .config(function ($routeProvider, $locationProvider) {
        $routeProvider
            .when('/engagement', { templateUrl: 'Pages/Engagement.html' });
        $locationProvider.html5Mode(true);


    })
    .controller('navController', 'NavController')
    .controller('engagementController', 'EngagementController');

function NavController($scope) {
    $scope.message = "Main Page";
}

function EngagementController($scope) {
    $scope.message = "Engagement Page";
};

会发生什么: 当我点击订婚链接时,我被引导到localhost / engagement并获得404.它似乎没有正确处理路由指令。

文件位置:Main.html是根目录,Engagement.html位于Pages子目录中。

2 个答案:

答案 0 :(得分:0)

首先使用root /

的url定义第一个路由

并检查模板的网址是否正确或文件夹是否正确定义

然后定义参与度

它确实有用

答案 1 :(得分:0)

使用app.js定义不同的状态,即。你的应用程序将拥有的不同页面。

然后在你的控制器中(点击按钮)你需要添加一行

$state.go('engagement');

按下按钮时将状态更改为正确的页面。