簡體   English   中英

AngularJS,Angular-Material-盡管$ scope上存在對象,HTML仍未呈現

[英]AngularJS, Angular-Material - HTML Not rendering despite object present on $scope

我已經在廣泛搜索該問題的解決方案,但似乎找不到。 在這里的任何幫助將不勝感激。

基礎:

  • 利用棱角材質的標簽
  • 從下拉列表中選擇一項后,將調用Firebase數據庫並返回響應,該響應將放入$ scope的數組中。
  • HTML正在對此響應對象使用ng-repeat。

問題:

  • 盡管響應對象存在於范圍內,但html不會呈現任何內容,直到用戶“單擊”視圖上的另一個按鈕-完全是任何按鈕。 實際上,用戶只需要觸摸/單擊屏幕上的某些內容,然后呈現結果即可。

  • 如果用戶調用數據庫以使藝術家使用某種媒介(例如繪畫),但沒有單擊屏幕上的任何內容,則盡管$ scope中存在響應對象,也不會顯示任何結果。

我感到難過。

HTML:

<md-tabs md-dynamic-height md-border-bottom md-center-tabs><md-tab label="Artists">
    <md-content id="tab_background" class="md-padding">
        <div class="query_results hide_link" layout-padding>
            <a ng-repeat="artist in results  | filter: searchText"
               href="/#/artist/{{artist.selectedMedium}}/{{artist.uid}}">
                <md-card>
                    <img ng-src="{{artist.profImg}}" class="md-card-image" alt="Washed Out">
                    <md-card-header>
                        <div id="card_play_button_included">
                            <md-card-header-text>
                                <span class="hide_link md-title">{{artist.name}}{{artist.name_last}}</span>
                                <span class="hide_link md-subhead">{{artist.selectedSubmedium[0]}}</span>
                                <span class="hide_link md-caption">{{artist.neighborhood}}</span>
                            </md-card-header-text>
                        </div>
                    </md-card-header>
                    <md-card-actions layout="row" layout-align="end center">
                    </md-card-actions>
                </md-card>
            </a>
        </div>
    </md-content>
    </md-tab>
        <md-tab label="Events">
    </md-tab>
</md-tabs>

使用Javascript:

  $scope.getArtists = function(medium){
    //resetting results array
    $scope.firstArray = [];
    $scope.results = [];
    var Medium = medium.name;
    firebase.database().ref('/Artists/' + Medium).once('value').then(function(snapshot){
      console.log(snapshot.val());
      var obj = snapshot.val();
      for (var key in obj) {
        var innerObj = obj[key]
        innerObj.uid = key;
        console.log(innerObj);
        $scope.firstArray.push(innerObj);
      }
      $scope.results = $scope.firstArray;
      $scope.runSpinner();
    })
  }

我使用$ scope.apply()並解決了它。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM