只能獲得第一級對象

-1

當用戶選擇該選項時，我通過在頁面上打印出的選擇框選擇了我的對象。只能獲得第一級對象

但是，它當前會打印嵌套在父對象中的父對象和所有其他對象。

我的數組

$scope.productsandformats = [ 
    { 
       "Pname": "parent", 
       "format": [ 
        {"Fname": "child", "id": "4"}, 
        {"Fname": "second child", "id": "5"} 
       ] 
      } 
];

我的角度和HTML選擇框

<select ng-model="formData.ProductType" 
     ng-options="product.Pname for product in productsandformats"> 
    <option value="">- Please Choose -</option> 
</select> 

<pre class="col-sm-12 ng-binding"> 
    {{ formData }} 
</pre>

所以目前的例子，當我選擇parent我得到

{「ProductType 「：{」 PNAME 「：」括號t「，」format「：[{」Fname「：」child「，」id「：」4「}，{」Fname「：」second child「，」id「：」5「}]}}

我希望看到什麼

{ 「ProductType」：{ 「PNAME」：「父」}}

我需要什麼

我只是想請參閱Pname這樣的頂級lev el對象，如parent, parent2, parent3等不是子對象。

我該如何改變這個只顯示頂級對象？

@George回答幾乎工程

困難我第二個下拉應與選定的父母和最後一個字符串的子對象來填充內容應爲以下，如果從第二個第一選項，然後第二個孩子選擇父選項。

產品型號：PNAME：父，formatType：FNAME：兩個箱子孩子

**角碼，第二填充了選定的父母子女**

<select ng-model="formData.ProductType" 
      ng-options="product.Pname for product in productsandformats"> 
     <option value="">- Please Choose -</option> 
    </select> 

    <select ng-model="formData.formatType" 
      ng-options="format.Fname for format in formData.ProductType.format" 
      ng-if="formData.ProductType"> 
     <option value="">- Please Choose -</option> 
    </select>

來源

2017-06-02 Beep

這是JSON不是傑森。 –

...這與JSON（或Jason）沒有任何關係。 – JJJ

是我的拼寫錯誤，謝謝你的看法，我怎麼會認爲投票簡單的拼寫錯誤有點多 – Beep

如果您閱讀ngOptions可以使用select as指定爲對象被設定在ngModel

對於第二個選擇我建議有第一選擇的ng-change該對象存儲上，您可以使用第二選擇範圍的另一個變量。

var myApp = angular.module('myApp', []); 
 

 
function MyCtrl($scope) { 
 
    $scope.productsandformats = [{ 
 
    "Pname": "parent", 
 
    "format": [{ 
 
     "Fname": "child", 
 
     "id": "4" 
 
    }, { 
 
     "Fname": "second child", 
 
     "id": "5" 
 
    }] 
 
    }]; 
 

 
    $scope.formats = []; 
 

 
    $scope.productTypeChange = function() { 
 
    $scope.formats = $scope.productsandformats.find(ps => ps.Pname == $scope.formData.ProductType.Pname); 
 
    } 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="myApp"> 
 
    <div ng-controller="MyCtrl"> 
 
    <select ng-model="formData.ProductType.Pname" ng-change="productTypeChange()" ng-options="product.Pname as product.Pname for product in productsandformats"> 
 
    <option value="">- Please Choose -</option> 
 
    </select> 
 
    <select ng-model="formData.formatType" ng-options="format.Fname for format in formats.format" ng-if="formData.ProductType.Pname"> 
 
    <option value="">- Please Choose -</option> 
 
    </select> 
 
    <pre class="col-sm-12 ng-binding"> 
 
    {{ formData }} 
 
    </pre> 
 
    </div> 
 

 
</div>

來源

2017-06-02 11:02:51 George

看起來不錯，將需要花費一些小分隊爲我的代碼改變它，因爲我有兩個選擇框，第二個填充取決於第一選擇。鏈接和信息+1。 – Beep

@Beep好的，我已經編輯了包含代碼，如果你想它被輸出爲「{」ProductType「：」parent「} – George

我更新了我的問題將完整的代碼 – Beep

你可以訪問像這樣的第一級對象

<div ng-repeat='p in formData.productType'> 
{{p.pname}} 
</div>

來源

2017-06-02 10:55:38

只能獲得第一級對象

回答

相關問題