angularjs - Angular Multistep 表单 - 需要将新表单元素绑定到模型

Question

我有一个多步骤表单，其中所有输入元素都绑定回一个模型，该模型与第一个请求一起加载。每个步骤都会将模型提交到服务器，并且会发回一组新的输入和 html，直到表单完成。

// The function that will be executed on form submit )
$scope.submitForm = function(action) {
    $scope.items['action'] = action;
    //Pass entire model to server and get back new input elements and html
    //I might break this up into a model per step later
    $http.post($scope.url, $scope.items).
    success(function(data, status) {
    // $scope.status = status;

    // Here is where I need to take the variable data and get the new html recompiled into angular.
    document.getElementById("formsteps").innerHTML = data;        

    })
    .error(function(data, status) {
        //$scope.data = data || "Request failed";
        //$scope.status = status;         
    })
}

<div id="formsteps" class="row form-horizontal">
    {{data}}
</div>

这是不正确的。它只是向我显示返回的文本。

将这些新表单输入重新绑定到现有模型的最佳方法是什么。编译，应用（）？

Answer 1

最好的方法是使用ngInclude或routes。但是，如果您的步骤 html 是动态生成的，那么您应该使用一些带有$compile服务的指令在 DOM 中插入新模板。