Angularjs:没有模板URL的路由和控制器

Question

是否可以在没有模板URL的情况下使用Angularjs的路由和控制器？

例如，下面是我当前的路由、控制器和模板 URL，

return app.config(['$routeProvider', function ($routeProvider) {
        $routeProvider
        .when("/",
        {
            templateUrl: "js/template/1.html",
            controller: "controller1"
        })
        .when("/list1",
        {
            templateUrl: "js/template/2.html",
            controller: "controller2"
        })
...

我的 html 中有ng-view，

<div ng-view></div>

我测试了没有templateUrl的路线，

return app.config(['$routeProvider', function ($routeProvider) {
            $routeProvider
            .when("/",
            {
                //templateUrl: "js/template/1.html",
                controller: "controller1"
            })
            .when("/view1",
            {
                //templateUrl: "js/template/2.html",
                controller: "controller2"
            })
    ...

结果 - 我的屏幕上没有显示任何内容。 显然无法再触发控制器。

Answer 1

使用带有空字符串的模板。

return app.config(['$routeProvider', function ($routeProvider) {
    $routeProvider
    .when("/",
    {
        template: "",
        controller: "controller1"
    })

Answer 2

Angular 使用$routeProvider定义将控制器附加到视图。如果您不想在配置中指定详细信息$routeProvider另一种选择是让应用程序使用类似以下内容登陆一个页面 -

  .config(function ($routeProvider) {
$routeProvider
  .when('/', {
    templateUrl: 'views/main.html'
  })
    .when()
    .otherwise({
    redirectTo: '/'
  });

}）;

这样用户将登陆主.html。现在主要.html您可以包含几个不同的 html 模板，例如 -

 <div ng-include src="'js/template/1.html'" ng-controller = 'Controller1'></div>
 <div ng-include src="'js/template/2.html'" ng-controller = 'Controller2'></div>

请注意上面使用/包含模板的语法 - "'<<Path>>'"

希望这有帮助。

Answer 3

使用空字符串设置模板会出错并导致递归加载; 我只需添加空HTML文件的链接即可解决它。

 return app.config(['$routeProvider', function ($routeProvider) {
    $routeProvider
    .when("/",
    {
       template: "dummy.htm",
       controller: "controller1"
    })