Javascript 无法在angularjs和firebase中绑定后端数据

我正在尝试将firebase数据库中的数据绑定到视图中的下拉列表

我的后端数据是

我的控制器

我的html文件

我无法将后端数据绑定到视图。我想显示所有的名字应该显示在下拉列表中。请帮帮我。提前谢谢。

换衣服

$scope.vendor\u dtls=$firebaseref

到

$scope.vendor\u dtls=$firebaseref.$asArray

及

添加了参考onchild_，functionsnapshot{ $scope.vendor\u dtls=snapshot.val； console.log$scope.vendor\u dtls； };

到

添加了参考onchild_，functionsnapshot{ var vendor\u dtl=snapshot.val； console.logvendor\u dtl； $scope.vendor\u dtls.pushvendor\u dtl；

---

};

我在dropdown.angular.forEachdata、functionvalue、key{//$scope.vendor\u dtls.push{//vendorName:value.vendorName}中没有获取任何数据。当我执行此操作时，我首先在DropDownList中获取数据从中移除标记。选择一个供应商{{vendor\u dtls}}，然后给出我删除但不起作用的任何备选方案

[{"_id":"5459beb12b7aedb40e000003",
    "vendorId":"prem123",
    "vendorName":"karn prem",
    "vendorContactNo":7897798789779},
{"_id":"545b3523bfc687100c000002",
  "vendorId":"wfwf",
 "vendorName":"wfwf",
  "vendorContactNo":3245353}]

    app.controller('VenueregCtrl', [ '$scope', '$location', '$http',
    > 'AuthServ', 'growl', '$firebase',
    >         function($scope, $location, $http, AuthServ, growl, $firebase){
    >           var ref = new Firebase("https://eventexchange.firebaseio.com");
    >     
    >           $scope.init = function()
    >           {
    >               $scope.user = AuthServ.getUser();
    >               $scope.venue = {};
    >               $scope.token = $scope.user.token;
    >               $scope.vendor_dtls = $firebase(ref);
    >               console.log("test",$scope.vendor_dtls);
    >               if($scope.user.scope == 'vendor')
    >               {
    >                   $scope.venue.vendor = $scope.user.user;
    >               }
    >               else
    >               {
    >                   $http.get('/vendor',{
    >                           headers: AuthServ.getAuthHeader()
    >                       })
    >                       .success(function (data, status) {
    >     
    >                           var x = ref.child("vendors");
    >                           x.remove();
    >                           angular.forEach(data,function(value, key){
    >                           x.push({
    >                               vendorName : value.vendorName
    >                           });
    >                       })
    >                       ref.on("child_added", function(snapshot) {
    >                                   $scope.vendor_dtls = snapshot.val();                    
    >                               console.log($scope.vendor_dtls);
    >                           
    >                       });
    >                           // console.log($scope.newPost);
    >     
    >                   })
    >     
    >               }   
    >               if(!$scope.user) {
    >                   $location.path('/signin');
    >               }
    >           };
    >           $scope.init();
    >     
    >           $scope.submit = function(venue_dtls,validity)
    >           {
    >               $scope.submitted=true
    >               if(validity)
    >               {
    >                   venue_dtls.events = venue_dtls.events.split(",")
    >                   $http.post('/venue',venue_dtls,
    >                       {headers: AuthServ.getAuthHeader()})
    >                   .success(function (data, status) {
    >                     $location.path('app/new-enquiries');
    >                   })
    >                   .error(function (data, status) {
    >                   });
    >               }
    >           };

>     
>           $scope.reset = function()
>           {
>               $scope.venue = {};
>               if($scope.user.scope == 'vendor')
>               {
>                   $scope.venue.vendor = $scope.user.user;
>               }
>               $scope.submitted = false;
>                growl.addSuccessMessage('Form reset succesfully');
>           };
>     }])

<div class="wrapper-md">
  <div class="panel panel-default">
    <div class="panel-heading wrapper b-b b-light">
      <h4 align='center' class="font-thin m-t-none m-b-none text-muted">Venue Registration</h4>
    </div>
    <div class="panel-body">
      <div class="form-horizontal ng-pristine ng-valid ng-valid-required" >
        <form name="new_venue" novalidate>  
          <div class="col-md-12">
            <div class="form-group">
              <label class="col-lg-2">Vendor</label>
              <div class="col-lg-10" ng-if="user.scope == 'vendor'">
                <input type="text" ng-model="venue.vendor" readonly/>
              </div>
              <div class="col-lg-10" ng-if="user.scope == 'admin'">
                <select ng-model="venue.vendor" style="width:174px;height:26px;" ng-options="vendor.vendorName for vendor in vendor_dtls" name="vendor" required>
                  <option value="">choose a vendor</option>{{ vendor_dtls}} 
                </select></br>
                <span style="color:red;" ng-if="new_venue.vendor.$error.required && submitted">*Vendor is not choosed
              </div>
            </div>
            <div class="form-group">
              <label class="col-lg-2">Venue Id</label>
              <div class="col-lg-10">
                <input type="text" ng-model="venue.venueId" name="venueId" required/></br>
                <span style="color:red;" ng-if="new_venue.venueId.$error.required && submitted">*Give a venue Id
              </div>
            </div>
            <div class="form-group">
              <label class="col-lg-2">Events</label>
              <div class="col-lg-10">
                <input type="text" ng-model="venue.events" name="events" required/></br>
                <span style="color:red;" ng-if="new_venue.events.$error.required && submitted">*Give a event type
              </div>
            </div>
            <div class="form-group">
              <label class="col-lg-2">Location</label>
              <div class="col-lg-10">
                <input type="text" ng-model="venue.location" name="location" required/></br>
                <span style="color:red;" ng-if="new_venue.location.$error.required && submitted">*Fill the location field
              </div>
            </div>
            <div class="form-group">
              <label class="col-lg-2">Capacity</label>
              <div class="col-lg-10">
                <input type="text" ng-model="venue.capacity" name="capacity" ng-pattern="/^[0-9]{1,7}$/" required/></br>
                <span style="color:red;" ng-if="new_venue.capacity.$error.required && submitted">*Fill the capacity field</span>
                <span style="color:red;" ng-if="new_venue.capacity.$error.pattern">*Invalid entry</span>
              </div>
            </div>
            <div class="form-group">
              <label class="col-lg-2">Price</label>
              <div class="col-lg-10">
                <input type="text" ng-model="venue.price" name="price" ng-pattern="/^[0-9]{1,7}$/" required/></br>
                <span style="color:red;" ng-if="new_venue.price.$error.required && submitted">*Fill the price field</span>
                <span style="color:red;" ng-if="new_venue.price.$error.pattern">*Invalid entry</span>
              </div>
            </div>
            <div class="form-group">
              <label class="col-lg-2">Currency</label>
              <div class="col-lg-10">
                <input type="text" ng-model="venue.currency" name="currency" required/></br>
                <span style="color:red;" ng-if="new_venue.currency.$error.required && submitted">*Fill the currency field
              </div>
            </div>  
          </div>
          <div class="form-group" style="margin-top:50px;">
            <div class="col-md-2">
              <button ng-click="submit(venue, new_venue.$valid)" class="btn btn-primary btn-block">Submit</button>
            </div>
            <div class="col-md-2">
              <button ng-click="reset()" class="btn btn-primary btn-block">Reset</button>
            </div> 
            <!-- <div class="col-md-2">
              <a class="btn btn-primary btn-block">Back</a>
            </div> -->           
          </div>
        </form>  
      </div>
    </div>
  </div>
</div>