Question

我在后端有一系列汽车，其长度由用户定义。因此，如果用户选择3辆汽车，阵列中将包含3个元素。我想在列表中的html元素中显示汽车的某些方面。该数组是基于javascript的。

有这样的效果：

<ul class="cars">
   <li>
      <img src=car[0].imageUrl>
      <h3>#{car[0].name}</h3>
      <span id="brand">#{car[0].brand}</span>
      <p>#{car[0].desc}</p>
   </li>
    <!--->until car[car.length-1]<!--->
</ul>

我是新人，所以如果我没有清楚地解释一下。我道歉，我会尽力澄清。

编辑：感谢所有反馈，结束使用ng-repeat。我意识到有多种方法可以给这只猫上皮。我的目标是获得多个答案。下次我知道要求一个特定的解决方案。

Answer 1

我真的不是想成为一个卑鄙的人......但你真是太离谱了，甚至很难知道从哪里开始。这甚至不是javascript代码如何执行。这些都不会运行，浏览器只会假设你想要显示它的奇怪文本。

JS不是你只需要粘贴在你的HTML代码中的任何地方，并让它输出就像你拥有它一样。它与HTML（不是脚本语言）分开运行。我不知道你从哪里得到＃{}的东西。这是对CSS样式的某种误解吗？

<ul id="cars"></ul>
<script>
    var car = [
        {imageUrl:'url1',name:'name1',brand:'brand1',desc:'desc1'},
        {imageUrl:'url2',name:'name2',brand:'brand2',desc:'desc2'},
        {imageUrl:'url3',name:'name3',brand:'brand3',desc:'desc3'},
        {imageUrl:'url4',name:'name4',brand:'brand4',desc:'desc4'}
    ]; // don't know where your array comes from, had to make my own

    var carsElem = document.getElementById('cars');
    var htmlOut = '';
    for (i=0; i<car.length; i++)
        htmlOut += '<li><img src="'+car[i].imageUrl+'"><h3>'+car[i].name+'</h3><span class="brand">'+car[i].brand+'</span><p>'+car[i].desc+'</p></li>';
    carsElem.innerHTML = htmlOut;
</script>

正如你所看到的那样，你看起来像没有什么。你放的是什么甚至没有任何形式的HTML / JavaScript。如果你希望能够做到这一点，你将不得不从零开始，并从'＃34; hello world＆＃34;中学习。

Answer 2

使用angular full html语法我假设你在控制器中有一个数组$scope.cars。

您可以使用ng-repeat创建列表：

<ul class="cars">
   <li ng-repeat="car in cars">
      <img ng-src="car.imageUrl">
      <h3>{{car.name}}</h3>
      <span id="brand">{{car.brand}}</span>
      <p>{{car.desc}}</p>
   </li>   
</ul>

html列出基于数组长度的元素

2 个答案: