使用同一路由显示动态AngularJs模板

Question

我是一名新手使用Angular Js。最近，我在处理路由和templateUrl方面的工作时遇到问题。这是直接了当的。但现在我想做一些可能的事情。

我希望能够在同一个路由中根据从服务器获取的数据属性显示不同的视图或模板。如果状态为A，则显示编辑模式；如果状态为B，则显示只读模式。数据值相同，除了状态外。我正在template中使用ng-if并来回切换。可以用这种方式完成，但出于可重用性的目的，我希望有一个单独的模板，并根据这些属性在路由中调用模板。

请告诉我是否可以实现。谢谢！

- Rana_S

Answer 1

这里有一个与这个问题非常接近的工作示例：在控制器中尝试基于常量动态设置templateUrl

如果我理解正确，方法如下：

• 使用 $stateParams 切换读取 / 编辑
• templateProvider 来选择模板
• $templateRequest 利用angular原生包装器覆盖 $http + $tempalteCache

状态定义非常简单：

$stateProvider
    .state('myState', {
        url: '/myState/:operation',

        templateProvider: ['$stateParams', '$templateRequest',
          function($stateParams, $templateRequest) {

            var templateName = 'read.html';

            if ($stateParams.operation === "edit") {
                 templateName = 'edit.html';
            } 

            return $templateRequest(templateName);
        }],
        controller: function ($state) {
        }
    });

并且链接到这个状态：

  <a href="#/myState/read">
  <a href="#/myState/edit">

Check the examle in action here

- Radim Köhler

---

谢谢您的时间和努力！我明白了。 - Rana_S