Javascript 角网格中的路由问题_Javascript_Angularjs

Javascript 角网格中的路由问题

javascript angularjs

Javascript 角网格中的路由问题,javascript,angularjs,Javascript,Angularjs,我对Angular很陌生，遇到了一个我无法回避的问题。我确实看到其他人问同样的问题，但是他们的问题与缺少的['ngRoute']有关。我检查了很多次代码，但是我可能遗漏了一些东西，所以我真的希望在这方面能得到一些帮助。提前谢谢目录 firstpage.html： <html ng-app="myApp"> <head> </head> <body> <div ng-view><

我对Angular很陌生，遇到了一个我无法回避的问题。我确实看到其他人问同样的问题，但是他们的问题与缺少的['ngRoute']有关。我检查了很多次代码，但是我可能遗漏了一些东西，所以我真的希望在这方面能得到一些帮助。提前谢谢

firstpage.html：

<html ng-app="myApp"> 
    <head>

    </head>
        <body> 
        <div ng-view></div>
        <script 
            src="angular.min.js">
        </script> 
        <script 
            src="angular-route.js">
        </script> 

        <script
            src="test.js">
        </script>

        </body>
</html>

var app = angular.module('myApp',['ngRoute']);
        app.config(function ($routeProvider) {
            $routeProvider
                .when('/',
                    {
                        controller: 'SimpleController',
                        templateUrl: 'Partials/View1.html'
                    })
                .when('/view2',
                    {
                        controller: 'SimpleController',
                        templateUrl: 'Partials/View2.html'
                    })
                .otherwise({redirectTo:'/'});
            });

        var controllers = {};
        controllers.SimpleController = function ($scope) {
            $scope.djs=[{name:'Adam Beyer',city:'Sweden',djRank:1},
                            {name:'Joseph Capriati',city:'Napoli',djRank:4},
                            {name:'Nina Kraviz',city: 'Moscow',djRank:7},
                            {name:'Adam Petrov',city:'Sofia',djRank:100}];

            $scope.addCustomer() = function () {
                $scope.djs.push({name:$scope.newCustomer.name,
                                city:$scope.newCustomer.city});
            };
        };
        app.controller(controllers);

<div class = "container">
    <h2>View 1</h2>
        Name: 
        <br/>   
        <input ng-model="filter.name" />
        <br/>
        <ul>
            <li ng-repeat="dj in djs|filter:filter.name|orderBy:'djRank'"> {{dj.name}} 
            </li>
        </ul>

        <br/>
        Customer Name: <br/>
        <input type="text" ng-model="customer.name" />
        <br/>
        Customer City: <br/>
        <input type="text" ng-model = "customer.city" />
        <br/>
        <button ng-click="addCustomer()">Add Customer</button>
</div>

View1.html：

<html ng-app="myApp"> 
    <head>

    </head>
        <body> 
        <div ng-view></div>
        <script 
            src="angular.min.js">
        </script> 
        <script 
            src="angular-route.js">
        </script> 

        <script
            src="test.js">
        </script>

        </body>
</html>

var app = angular.module('myApp',['ngRoute']);
        app.config(function ($routeProvider) {
            $routeProvider
                .when('/',
                    {
                        controller: 'SimpleController',
                        templateUrl: 'Partials/View1.html'
                    })
                .when('/view2',
                    {
                        controller: 'SimpleController',
                        templateUrl: 'Partials/View2.html'
                    })
                .otherwise({redirectTo:'/'});
            });

        var controllers = {};
        controllers.SimpleController = function ($scope) {
            $scope.djs=[{name:'Adam Beyer',city:'Sweden',djRank:1},
                            {name:'Joseph Capriati',city:'Napoli',djRank:4},
                            {name:'Nina Kraviz',city: 'Moscow',djRank:7},
                            {name:'Adam Petrov',city:'Sofia',djRank:100}];

            $scope.addCustomer() = function () {
                $scope.djs.push({name:$scope.newCustomer.name,
                                city:$scope.newCustomer.city});
            };
        };
        app.controller(controllers);

<div class = "container">
    <h2>View 1</h2>
        Name: 
        <br/>   
        <input ng-model="filter.name" />
        <br/>
        <ul>
            <li ng-repeat="dj in djs|filter:filter.name|orderBy:'djRank'"> {{dj.name}} 
            </li>
        </ul>

        <br/>
        Customer Name: <br/>
        <input type="text" ng-model="customer.name" />
        <br/>
        Customer City: <br/>
        <input type="text" ng-model = "customer.city" />
        <br/>
        <button ng-click="addCustomer()">Add Customer</button>
</div>


视图1
姓名：





{{dj.name}




客户名称：



客户城市：



添加客户

View2.html：

 <div class="container">
    <h2>View 2</h2>
    City:
    <br/>
    <input type = "text" ng-model="city" />
    <br/>
    <ul>
        <li ng-repeat= "dj in djs |filter:city"</li>
    </ul>
</div>


视图2
城市：





你的控制器打错了。应该是
$scope.addCustomer = function () {
    $scope.djs.push({name:$scope.newCustomer.name,
                     city:$scope.newCustomer.city});
};

不是
请注意，addCustomer
后面的括号不应该出现。
您在控制器中输入了一个错误。应该是
$scope.addCustomer = function () {
    $scope.djs.push({name:$scope.newCustomer.name,
                     city:$scope.newCustomer.city});
};

不是
注意addCustomer
后面的括号不应该出现。
您到底有什么问题？控制台是否给出任何错误？我在一个视图中重新创建了您的代码，我看不到任何错误，除了您在两个视图中都没有切换到另一个视图的链接。。。。你能详细说明你的问题是什么吗？看看浏览器的JavaScript控制台。这就是错误所在。你所描述的问题在我发布的plunker中是不可复制的，尽管还有其他错误。您应该检查控制台是否有错误，并确定本地配置中是否有与您在此处发布的代码不同的内容。解决路由问题后，您肯定需要纠正addCustomer
函数中的一些问题，不过…@RadoslavNaidenov I什么意思是浏览器中的JavaScript控制台。它将记录发生的任何错误，并将对调试JavaScript代码有很大帮助。谷歌“你到底有什么问题？控制台是否给出任何错误？我在一个视图中重新创建了您的代码，我看不到任何错误，除了您在两个视图中都没有切换到另一个视图的链接。。。。你能详细说明你的问题是什么吗？看看浏览器的JavaScript控制台。这就是错误所在。你所描述的问题在我发布的plunker中是不可复制的，尽管还有其他错误。您应该检查控制台是否有错误，并确定本地配置中是否有与您在此处发布的代码不同的内容。解决路由问题后，您肯定需要纠正addCustomer
函数中的一些问题，不过…@RadoslavNaidenov I什么意思是浏览器中的JavaScript控制台。它将记录发生的任何错误，并将对调试JavaScript代码有很大帮助。谷歌“这确实是代码中的一个错误，但它不能解释OP询问的路由问题，并且在他们的评论中已经澄清了……对，当我发布答案时，该评论还没有出现。这确实是代码中的一个错误，但它不能解释OP询问的路由问题，并且在他们的评论中已经澄清了……对，当我发布答案时，那条评论还没有出现。