Javascript AngularJS,AngularMaterial-尽管$scope上存在对象,但HTML不呈现
我已经广泛地寻找这个问题的解决方案,但似乎找不到。这里的任何帮助都将不胜感激 基础知识:Javascript AngularJS,AngularMaterial-尽管$scope上存在对象,但HTML不呈现,javascript,angularjs,angular-material,Javascript,Angularjs,Angular Material,我已经广泛地寻找这个问题的解决方案,但似乎找不到。这里的任何帮助都将不胜感激 基础知识: <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"
<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>
$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();
})
}
- 利用角材质选项卡
- 从下拉列表中选择项目后,将调用firebase数据库并返回响应,该响应将放入$scope上的数组中
- HTML在此响应对象上使用ng repeat李>
- 尽管响应对象存在于作用域中,但html不会呈现任何内容,直到用户“单击”视图上的另一个按钮——任何按钮。事实上,用户只需触摸/单击屏幕上的某个内容,然后渲染结果
- 如果用户调用数据库以获取特定介质(即绘画)中的艺术家,但未单击屏幕上的任何内容,则不会显示任何结果,尽管$scope中存在响应对象
<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>
$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()解决了这个问题