📜  如何在AngularJS中的对象中选择第一个对象?

📅  最后修改于: 2021-05-13 18:36:03             🧑  作者: Mango

我们要处理的主要问题是,对于读取特定索引位置的对象的对象而言,它不像列表那样简单。我们不能使用ngFor对其进行循环,因为它不被认为是可迭代的对象。当从任何来源接收的数据是包含对象(例如JSON文件)的对象时,此问题的重要性可能会升高。
更改源文件非常不方便,因此我们需要能够在应用程序本身中执行某些操作。最有效的方法隐藏在问题本身中。如果对象不是可迭代的,请将其转换为可迭代的。

下面讨论了两种方法来解决此问题。

  • 方法1:
    • 使用ng-repeat指令和limitTo过滤器。
    • ng-repeat能够迭代对象的属性,在我们的例子中,对象就是对象本身。使用以下语法:
      < div ng-repeat="(key, value) in myObj" > ... < /div >
    • limitTo过滤器将创建一个仅包含指定数量的元素的新数组或字符串。元素取自源数组末尾的开始,字符串或数字,由limit的值和符号(正数或负数)指定。

    句法:

    html binding:
    {{ limitTo_expression | limitTo : limit : begin}}
    

    示例:可以更改限制的值以获得可迭代的元素(在这种情况下为对象)

    
    
      
    
        Angular first object in object
        
    
      
    
        
            
                  
    •                 {{prop}}: {{value}}             
    •         
        
           

    输出:这是对象机构的第一个对象的元素(在上面的代码中提到)。

  • 方法二:
    • 将对象的对象转换为对象的数组,并使用方括号([])的索引方法显示数组的第一个对象。

    句法:

    {{name_of_the array[index]}}

    示例:数组的第一个对象的索引值为0。由于数组的元素是对象,我们可以使用(。)运算符引用对象的属性。

    
    
      
    
        Angular first object in object
        
    
      
    
        
            

    The Name of the school is: {{institute[0].name}}

        
              

    输出:这显示了对象机构的第一个对象的属性之一(在上面的代码中提到)。