Ng-包括失去范围

时间:2016-11-21 10:12:54

标签: html angularjs forms angularjs-scope angularjs-ng-include

我需要根据用户点击不同的按钮显示不同的表单。用户应该能够切换不同的表单并读取之前插入的数据。不幸的是,似乎ng-include不保留范围,但刷新数据显示。

代码:

...
<div ng-include src="formToBeOpened.urlForm"></div>
...

formToBeOpened更改用户点击不同的按钮,.urlForm是一个字符串(例如&#34; option1.html&#34;,&#34; option2.html&#34;)

如何使用ng-include保存数据?

1 个答案:

答案 0 :(得分:0)

尝试使用以下解决方案

&#13;
&#13;
function TodoCtrl($scope) {
  $scope.templateUrl = 'form1.html';
  $scope.changeForm = function(url){
   $scope.templateUrl = url;
  }
}
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div ng-app>
    <div ng-controller="TodoCtrl">
        <script type="text/ng-template" id="form1.html">
            <h2>Hello1</h2>
        </script>

        <script type="text/ng-template" id="form2.html">
            <h2>Hello2</h2>
        </script>
        
        <div ng-include="templateUrl"></div>
        <button ng-click="changeForm('form1.html')">Form1</button>
        <button ng-click="changeForm('form2.html')">Form2</button>
    </div>
</div>
&#13;
&#13;
&#13;

希望这对你有帮助。