向Angular Form添加文本框

时间:2016-03-28 23:24:40

标签: angularjs forms dynamic angularjs-scope angularjs-ng-repeat

我试图动态地将文本框添加到Angular表单中。我正在使用ng-repeat,只需按一个空字符串即可轻松添加文本框。它将添加另一个文本框,问题是ng-model没有同步数据,并且当添加文本时它仍然是一个空字符串。

从初始数组同步创建的文本框就好了,它只是新添加的文本框无效。

我一直在四处寻找,我看到的一个建议是始终使用"。"当使用ng-model时,但这对我没用。

angular
    .module('app.article')
    .controller('ArticleEditController', ArticleEditController);

ArticleEditController.$inject= ['articleEditDataService', '$routeParams', '$log'];   

function ArticleEditController(articleEditDataService, $routeParams, $log) {
    var vm = this;

    var site = $routeParams.site;
    var articleName = $routeParams.article;
    var articleRevision_id = $routeParams.revision_id;

    vm.data = {};
    vm.addNewText = addNewText;
    vm.removeText = removeText;
    vm.saveArticle = saveArticle;
    vm.numMessage = 1;

    activate();

    function activate(){
        getArticle();
    }

    function getArticle(){
        var data = articleEditDataService.getArticle(site, articleName, articleRevision_id);
        data.then(function successResponse(res) {
            vm.data = res.results.data;
        }, function errorResponse (res) {
            console.log(res);
        });
    }

    function saveArticle(){
        var article = articleEditDataService.postArticle(vm.data, site, articleName, articleRevision_id);
        console.log(vm.data);
        article
            .then(updateArticleSuccess)
            .catch(updateArticleError);
    }

    function updateArticleSuccess(message){
        $log.info(message);
    }

    function updateArticleError(errorMessage){
        $log.error(errorMessage);
    }


    function addNewText (index, key) {
      vm.data.content.image_sets[key].text.push("");
    }

    function removeText (index, key) {
      if(vm.data.content.image_sets[key].text.length > 1){
        vm.data.content.image_sets[key].text.pop();
      }
    }


};

控制器:

(function(){     '使用严格的';

{{1}}

})();

1 个答案:

答案 0 :(得分:0)

将控制器中的模型变量初始化为空对象。

然后在你的文本输入你的ng-model =“model [$ index]”。