【问题标题】:Is it possible to have double array in Angularjs form?Angularjs 形式可以有双数组吗?
【发布时间】:2012-04-03 02:08:06
【问题描述】:

我最近在我的项目中使用了 Angularjs。我正在尝试创建一个动态表单,使用户能够创建填字游戏问题。我正在考虑使用 angularjs 来允许用户在他们的答案中添加额外的行和列。在我的表单中,我创建了一个名为“answer”的输入,它有 2 个子元素行和列,“column”也有它自己的子元素。这是我到目前为止所做的:

html页面:

Answer for the question: [<a href='' ng:click='form.answer.$add()'>AddRow</a>]

    <table>
        <div ng:repeat='ans in form.answer'>
            <tr>
                <td>{{ans.row}}</td>
                <div ng:repeat='col in ans.column'>
                    <td><input type='text' name="col.word" ng:required/></td>
                </div>
                [<a href='' ng:click='col.$add()'>AddCol</a>]
            </tr>
        </div>
    </table>

javascript:

questionCtrl.$inject = ['$invalidWidgets'];
function questionCtrl($invalidWidgets) {
    this.$invalidWidgets = $invalidWidgets;
    this.master = {
        title: 'title',
        descr:'description here',
        answer: [{row:'1', column:[{word:'z'},{word:'x'}]}
                ,{row:'2', column:[{word:'a'},{word:'w'}]}
                ],
        user:''
    };
    this.cancel();
}

questionCtrl.prototype = {
    cancel : function(){ this.form = angular.copy(this.master); },
    save: function(){
        this.master = this.form;
        this.cancel();
    }
};

我已经设法允许用户在他们的答案中添加行,但我根本无法显示列数组的元素。这是因为我的代码有问题还是 Angularjs 不允许在其形式中使用双数组?对不起,如果我的解释不清楚。

【问题讨论】:

  • html 是无效的——你不能在 里面有
    ,但是在 外面,我猜浏览器会把它去掉。顺便说一句,你能更新到最新的 Angular 吗?看起来你用的是很旧的...
  • 谢谢!有效 :) 。改用跨度。无论如何,我不确定我实际使用的是什么版本。有点像我在网站上看到的一个例子。
  • 你不能在&lt;tr&gt;&lt;table&gt; 内有跨度(只在&lt;td&gt; 内),Chrome 可能允许,但 IE 不允许。刚刚发布了带有工作代码的回复。您可以在code.angularjs.org/1.0.0rc1 获取最新的 Angular(您使用的是 0.9.*)

标签: javascript angularjs


【解决方案1】:

html 无效,表内不能有div

<table>
  <tr ng:repeat='ans in form.answer'>
    <td>{{ans.row}}</td>
    <td ng:repeat='col in ans.column'><input type='text' name="col.word" ng:required/></td>
    <td>[<a href='' ng:click='ans.column.$add()'>AddCol</a>]</td>
  </tr>
</table>​

这里是使用最新 Angular 的 jsfiddle:http://jsfiddle.net/vojtajina/ugDpW/

【讨论】:

    猜你喜欢
    相关资源
    最近更新 更多
    热门标签