Angularjs 无法在Angular JS中实现视图和布线

我已经在一个名为partials的文件夹中创建了关于.html、experiments.html和home.html的简单html文件，但无法在ng视图中呈现那里的视图。我还尝试了一个简单的{{5+5}}，但也不起作用。我正在使用配置和控制器。 https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js'> https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-route.js"> 演示角度JS 标志 我的网站 {{ 5 + 5 }}

var app = angular.module('demoApp', ["ngRoute"])

    .config(function($routeProvider){
    $routeProvider
    .when('/about', { templateUrl:'/partials/about.html'})
    .when('/experiments', { templateUrl:'/partials/experiments.html'})
    .otherwise({ redirectTo:'/home',  templateUrl:'/partials/home.html'})
    })

.controller(function MainCtrl($scope){
$scope.x = "Hello";
});
</script>
</body>
</html>

var-app=angular.module（'demoApp'，[“ngRoute”]）
.config（函数（$routeProvider）{
$routeProvider
.when（'/about'，{templateUrl:'/partials/about.html'}）
.when（'/experiments'，{templateUrl:'/partials/experiments.html'}）
。否则（{重定向到：'/home'，模板URL:'/partials/home.html'}）
})
.controller（函数MainCtrl（$scope）{
$scope.x=“你好”；
});

var app = angular.module('demoApp', ["ngRoute"])

    .config(function($routeProvider){
    $routeProvider
    .when('/about', { templateUrl:'/partials/about.html'})
    .when('/experiments', { templateUrl:'/partials/experiments.html'})
    .otherwise({ redirectTo:'/home',  templateUrl:'/partials/home.html'})
    })

.controller(function MainCtrl($scope){
$scope.x = "Hello";
});
</script>
</body>
</html>

var-app=angular.module（“myApp”[“ngRoute”]）；
app.config（函数（$routeProvider）{
$routeProvider
.当（“/”时{
模板：“第一视图”
})
.when（“/red”{
模板：“第二”
})
.when（“/绿色”{
模板：“第三”
})
.when（“/blue”{
模板：“第四”
});
});

检查修改后的代码..在这里 更新的代码片段

var app = angular.module('demoApp', ["ngRoute"])

    .config(function($routeProvider){
    $routeProvider
    .when('/about', { templateUrl:'/partials/about.html'})
    .when('/experiments', { templateUrl:'/partials/experiments.html'})
    .otherwise({ redirectTo:'/home',  templateUrl:'/partials/home.html'})
    })

.controller(function MainCtrl($scope){
$scope.x = "Hello";
});
</script>
</body>
</html>

var-app=angular.module（'demoApp'，[“ngRoute”]）；
app.config（函数（$routeProvider）{
$routeProvider
.when（'/'，{templateUrl:'partials/about.html'，controller:'MainCtrl'}）
.when（'/about'，{templateUrl:'partials/about.html'，controller:'abtCtrl'}）
.when（'/experiments'，{templateUrl:'partials/experiments.html'，controller:'exptCtrl'}）
。否则（{重定向到：'/other'，模板URL:'partials/other.html'}）
});
应用程序控制器（'MainCtrl'，函数（$scope）{
$scope.x=“你好”；
});
应用控制器（'abtCtrl'，功能（$scope）{
$scope.x=“关于”；
});
应用程序控制器（'exptCtrl'，函数（$scope）{
$scope.x=“exptCtrl”；
})；

{{5+5}}
关于页面
实验页
其他页面

请从控制台提供错误。“错误：[$compile:tpload]无法解析模板位置。请告诉我你的应用程序的目录结构好吗。也许可以试试这个。。不要使用“/partials/home.html”，而是使用“partials/home.html”。我的意思是从开头删除斜杠。@ManishSingh我的主页（index.html）位于桌面上一个名为“网站”的文件夹中。在网站文件夹中，我有index.html和另一个名为partials的文件夹。内部部分是三个模板，即about、home和experiments.html。我试图删除斜杠，但没有任何其他想法。我认为，进入开发者选项->源选项卡的更好方式。。检查加载了哪个文件，因为一切正常。

template

可以是

templateUrl

如果您想给模板urlsHi Anil，感谢您解决{5+5}错误。。。。但我仍然无法在ng视图中获取模板。。。。。我的目录结构是Desktop-->Website-->index.html，Partials-->about.html，home.html，experiments.html。我已经更新了snippet和fiddle。。。希望这对你有帮助。