Angularjs NgRoute的控制器不index.html中NG-視圖中工作

我的文件都在這裏https://files.fm/u/va89pjm7#_Angularjs NgRoute的控制器不index.html中NG-視圖中工作

的代碼是非常非常簡單。爲什麼我不能在localhost：8080/mail中調用{{mail.msg}}，即使我將mail/mail路由爲mail.html？

Thx爲精彩社區的stackoverflow。

這裏是代碼如下：

server.js

// get the things we need 
    var express = require('express'), 
     app  = express(), 
     path = require('path'); 

    app.use(express.static('./')); // default index.html 
    app.get('*', function(req, res) { 
     res.sendFile(path.join(__dirname + '/index.html')); 
    }); 

    app.listen(process.env.PORT || 8080);

的package.json

{ 
    "name": "node-api", 
    "main": "server.js", 
    "dependencies": { 
    "bcrypt-nodejs": "0.0.3", 
    "body-parser": "~1.9.3", 
    "express": "~4.10.3", 
    "jsonwebtoken": "^1.2.0", 
    "mongoose": "~3.8.19", 
    "morgan": "~1.5.0" 
    } 
}

ngapp.js

angular.module("firstApp", ['ngRouter']) 
.controller("mainController", function() { 
    var vm = this; 
    vm.msg = "Hello from mainController controller"; 

}) 


.controller('mailController', function() { 
    var vm = this; 
    vm.msg = "Hello from mailController controller"; 
});

個

ng_route.js

angular.module('ngRouter', ['ngRoute']) 
     .config(function($routeProvider, $locationProvider) { 
      $routeProvider 
       .when('/mail', { 
        templateUrl: "mail.html", 
        controller: "mailController", 
        controllerAs: "mail" 
       }); 


      $locationProvider.html5Mode(true); 
     });

mail.html

<h3>Hello {{mail.msg}}</h3>

的index.html

<!DOCTYPE html> 
<html> 
    <head> 
     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0/angular.min.js"></script> 
     <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.5/angular-route.js"></script> 

     <script src="ngapp.js"></script> 
     <script src="ng_route.js"></script> 

    </head> 
    <body ng-app="firstApp"> 
     <section ng-controller="mainController as main"> 
      <p>{{main.msg}}</p> 
     </section> 

     <main> 
      <div ng-view></div> 
      <ng-view></ng-view> 
     </main> 
    </body> 
</html>

結果： localhost：8080/mail =您好來自mainController控制器 localhost：8080 =您好mainController控制器

來源

2016-02-27 user5500116

請張貼在這個問題 –

@SimonH沒有你看到的鏈接相關的代碼？ – user5500116

爲什麼我得到-1點？我沒有做錯什麼！ – user5500116

請嘗試以下，我有時覺得有必要。

angular.module("firstApp", ['ngRouter']); 
.controller("mainController", function() { 
    var vm = this; 
    vm.msg = "Hello from mainController controller"; 
    return vm; 
})

，你需要thrse線的一個或另一個，但不能同時

 <div ng-view></div> 
     <ng-view></ng-view>

來源

2016-02-27 21:31:07

感謝您的嘗試，但仍然無法工作 – user5500116

由於某種原因，即使基本不工作 – user5500116

嘗試使qplnkr顯示它不工作，我可以看看 –

Angularjs NgRoute的控制器不index.html中NG-視圖中工作

回答

相關問題