ng-include 丢失数据 angularjs

Question

我是 angularjs 的新手，我在尝试在表单中使用 ng-include 时遇到问题。

HTML形式：

<form method="post" id="formQuestion" name="formQuestion" ng-submit="sendForm()" novalidate ng-controller="questionValidation">
<ul>

    <div class="slide-animate" ng-include="'/templates/default/partials/_fields/f1.html'"></div>
    <div class="slide-animate" ng-include="'/templates/default/partials/_fields/f2.html'"></div>

f1 视图部分

<li class="text-center">

<div>{{data | json}}</div>

控制器问题表单（父级）

.controller('questionForm', function($scope, $routeParams) {
    $scope.data = {};
    $scope.data.productTypeUrl = $routeParams.stringUrl;
    ...

控制器问题验证（子）

.controller('questionValidation', ['$scope', '$http', function ($scope, $http) {
    alert($scope.$parent.data.productTypeUrl);
    $scope.isSubmit = false;
    ...

控制器中的警报显示了正确的值，但是当我尝试将此值显示到视图中时 f1.html，该值未显示。

我错过了什么？

提前谢谢你。

Answer 1

我认为问题是您生成了无效的 html，您将 div 放在了 ul 中。所以可能在 angular 开始之前，您的浏览器修复了无效 html。在 table 中拥有指令是类似的问题，有一些解决方案，第一个，用 div 替换你的 ul 和 li 标签，或者你的 div 更改为li 另一个，使用指令替换那些元素。

首先尝试替换这个：

<form method="post" id="formQuestion" name="formQuestion" ng-submit="sendForm()" novalidate ng-controller="questionValidation">
<ul>

    <div class="slide-animate" ng-include="'/templates/default/partials/_fields/f1.html'"></div>
    <div class="slide-animate" ng-include="'/templates/default/partials/_fields/f2.html'"></div>

有了这个：

<form method="post" id="formQuestion" name="formQuestion" ng-submit="sendForm()" novalidate ng-controller="questionValidation">
<ul>

    <li class="text-center slide-animate" ng-include="'/templates/default/partials/_fields/f1.html'"></li>
    <li class="text-center slide-animate" ng-include="'/templates/default/partials/_fields/f2.html'"></li>

和 f1 视图：

<div>{{data | json}}</div>

ng-include 丢失数据 angularjs

ng-include lose data angularjs

javascript

angularjs

angularjs-ng-include