如何在角度js中增加数组?

时间:2015-08-22 13:23:05

标签: arrays angularjs html5 ng-repeat

//这是我的HTML,我想知道如何增加这个,所以我可以访问pdf并显示它。我的问题是,如果我只是调用course.pdfs pdf的将是所有相同所以我想每次添加[0]以在每个模态上显示不同的pdf,或者如果我对该解决方案有误,我希望你们可以帮助我以不同的方式显示pdf。

  <div class="container1">

    <li ng-repeat="course in secondyear">Second Year: <br>
    <span ng-repeat = "subject in course.subjects"><br>{{subject}}<br>
    <button type="button" class="btn btn-info btn-lg" data-toggle="modal"
    data-target="{{course.modal}}">Course Outline</button><br></span>
                 <div id="{{course.mod}}" class="modal fade" role="dialog">
                 <div class="modal-dialog">
                  <div class="modal-content">
        <div class="modal-header">
         <button type="button" class="close" data-dismiss="modal">&times;    </button>
         <h4 class="modal-title">Course Description</h4>
        </div>

       <div class="modal-body">
 <iframe src="{{course.pdfs[0]}}" width="100%" height="600px" scrolling="auto"></iframe> 

//这是我的角度js

app.controller("courseCtrl", function($scope, firstyearFactory){
$scope.secondyear=[
    {
        name: '4',
        pdfs: ['a.pdf','b.pdf','c.pdf'],
        modal: '#modal1',
        mod:'modal1',
        subjects:['english','math','adverpub']


    }
        ];

//我可以这样做,但我有这么多的数据导致滞后,当我刷新它时它如此滞后所以我认为它滞后因为我有这么多的键或变量我宣布这就是为什么我来了显示只有一个对象的属性,如(name :)。顺便说一句,我有超过20个键,这就是为什么它的滞后

 {year:'1st Year', 
         name: '1ENGLISH',
            pdfs: 'pdf/1st/1ENGLISH.pdf',
            modal: '#modal1',
            mod:'modal1'
        },
        {year:'1st Year', 
         name: '1SPEECH',
            pdfs: 'pdf/1st/1SPEECH.pdf',
            modal: '#modal2',
            mod:'modal2'    
        },

1 个答案:

答案 0 :(得分:2)

您可以使用ng-repeat's $index变量在每次迭代中获取另一个pdf:

<iframe src="{{course.pdfs[$index]}}" width="100%" height="600px" scrolling="auto"></iframe> 

此外,您可能需要更改迭代的内容 - 它可能应该是course in secondyear.pdfs,如果需要,可以在当前的内部添加另一个ng-repeat,只是为了构建模态:< / p>

<li ng-repeat="course in secondyear">
  <div class="modal-body" ng-repeat="pdf in course.pdfs">
    <iframe src="{{pdf[$index]}}" width="100%" height="600px" scrolling="auto"></iframe>