我不知道为什么角度路由不适合我 [英] I don't know why angular routing didn't work with me

查看:80
本文介绍了我不知道为什么角度路由不适合我的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我不知道为什么角度路由不适合我。我修改了代码10次,但我找不到解决方案。我的索引页面就像

 <  !DOCTYPE     html  >  
< html ng-app = myApp >
< head >
< title > < / title >
< meta charset = utf-8 / >
< link href = Content / bootstrap.css rel = 样式表 / >
< script src = scripts / jquery-1.9.0.js > < / script >
< script src = scripts / bootstrap.js > < / script >
< script src = scripts / angular.js &g t; < / script >
< script src = scripts / angular-route.js > < / script >
< script src = demo.js > < / script >
< / head >
< 正文 >
< < span class =code-leadattribute> div
class = 容器 >
< nav 样式 = background-color:darkslateblue 角色 = navigation
class = nav navbar-inverse >
< span class =code-keyword>< ul class = nav navbar-nav >
< li class = 有效 > < a href = #home > home < span class =code-keyword>< / a > < / li >
< span class =code-keyword>< li > < a href = #add > ; 添加< / a > < / li >
< li > < a href = #edit > 编辑< / a > < / li >
< li > < a href = #delete > delete < / a > < / li >
< / ul >
< / nav >

< ng-view >

< / ng-view >

< h3 style = font-size:small class = text-center text-info > < / h3 >
< / div >
< / body >
< / html >



和我的javascript页面是

  //   /< reference path =C:\ Users \elwany \documents\visual studio 2015 \Projects\sappapplication\sappapplication\scripts / angular.js/>  

var myApp = angular.module( myApp,[' ngRoute']);
myApp.config([' $ routeProvider'
function ($ routeProvider){
$ routeProvider。
when(' / add',{
templateUrl:' Views / add.html'
控制器:' addController'
})。
when(' / edit',{
templateUrl:' Views / edit.html'
controller:' editController'
})。
when(' / delete',{
templeteU rl:' Views / delete.html'
controller:' deleteController'
})。
when(' / home',{
templateUrl: Views / home.html'
controller:' homeController'
})。否则为
({redirectTo:' / home'});
}]);

myApp.controller( addController function ($ scope){
$ scope.message = 添加查看控制器;
});
myApp.controller( editController函数($ scope){
$ scope.message = 在编辑视图中控制器;
});
myApp.controller( deleteController函数($ scope){
$ scope.message = 在删除视图中控制器;
});
myApp.controller( homeController函数($ scope){
$ scope.message = 在主视图中控制器;
});





我有 4  html pages  in   查看文件夹,其名称   添加  edit   delete  home并且它们具有相同的内容。





  <   div     class   =  row jumbotron >  
< h2 > {{message}} < / h2 >
< / div >



请注意我从nugets经理下载了角度,我使用asp.net



我尝试过:



角度路由代码不起作用我没有任何语法错误但我想知道它为什么不起作用

解决方案

< blockquote> routeProvider',
function

routeProvider){


routeProvider。
when(' / add',{
templateUrl:' Views / add.html'
controller:' addController'
})。
when(' / edit',{
templateUrl:' Views / edit.html'
controller:' editController'
})。
when(' / delete',{
templeteUrl: Views / delete.html'
controller:' deleteController'
})。
when(' / home',{
templateUrl: Views / home.html'
controller:' homeController'
})。否则为
({redirectTo:' / home'});
}]);

myApp.controller( addController function


i don't know why angular routing didn't work with me. I revised the code 10 times and I couldn't find the solution. My index page is like

<!DOCTYPE html>
<html ng-app="myApp">
<head>
    <title></title>
    <meta charset="utf-8" />
    <link href="Content/bootstrap.css" rel="stylesheet" />
    <script src="scripts/jquery-1.9.0.js"></script>
    <script src="scripts/bootstrap.js"></script>
    <script src="scripts/angular.js"></script>
    <script src="scripts/angular-route.js"></script>
    <script src="demo.js"></script>
</head>
<body>
    <div class="container">
        <nav style="background-color:darkslateblue" role="navigation" class="nav navbar-inverse">
            <ul class="nav navbar-nav">
                <li class="active"><a href="#home">home</a></li>
                <li><a href="#add">add</a></li>
                <li><a href="#edit">edit</a></li>
                <li><a href="#delete">delete</a></li>
            </ul>
        </nav>

      <ng-view>

      </ng-view>

        <h3 style="font-size:small" class="text-center text-info">developed by Mr-Mohammed Elwany</h3>
    </div>
</body>
</html>


and my javascript page is

/// <reference path="C:\Users\elwany\documents\visual studio 2015\Projects\spaapplication\spaapplication\scripts/angular.js" />

var myApp = angular.module("myApp", ['ngRoute']);
myApp.config(['$routeProvider',
    function ($routeProvider) {
        $routeProvider.
        when('/add', {
            templateUrl: 'Views/add.html',
            controller:'addController'
        }).
        when('/edit', {
            templateUrl: 'Views/edit.html',
            controller: 'editController'
        }).
        when('/delete', {
            templeteUrl: 'Views/delete.html',
            controller: 'deleteController'
        }).
        when('/home', {
            templateUrl: 'Views/home.html',
            controller: 'homeController'
        }).
        otherwise({ redirectTo: '/home' });
    }]);

myApp.controller("addController",function ($scope) {
    $scope.message = "in Add view Controller";
});
myApp.controller("editController",function ($scope) {
    $scope.message = "in edit view Controller";
});
myApp.controller("deleteController",function ($scope) {
    $scope.message = "in delete view Controller";
});
myApp.controller("homeController",function ($scope) {
    $scope.message = "in home view Controller";
});



I have 4 html pages in "Views" folder their name is "add","edit","delete","home" and they have the same content.



<div class="row jumbotron">
    <h2>{{message}}</h2>
</div>


note that i downloaded angular from nugets manager and i use asp.net

What I have tried:

the angular routing code not work i didn't have any syntax error but i wish like to know why it doesn't work

解决方案

routeProvider', function (


routeProvider) {


routeProvider. when('/add', { templateUrl: 'Views/add.html', controller:'addController' }). when('/edit', { templateUrl: 'Views/edit.html', controller: 'editController' }). when('/delete', { templeteUrl: 'Views/delete.html', controller: 'deleteController' }). when('/home', { templateUrl: 'Views/home.html', controller: 'homeController' }). otherwise({ redirectTo: '/home' }); }]); myApp.controller("addController",function (


这篇关于我不知道为什么角度路由不适合我的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

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