AngularJS 功能范围似乎不起作用

Question

我有两个 ajax 电话。数据从 html（输入）开始，当按下回车键时，输入字段中的内容被发送到控制器，然后发送到进行第一个 ajax 调用的工厂。成功在控制器中处理，然后请求另一个 ajax 调用，来自该请求的数据再次在控制器中处理。我有一个 $scope -- $scope.ytChannel = data.items; 在似乎不起作用的功能中的最终成功。这是我的代码，以 html

开头

HTML:

<input class="form-control channel-index" type="text" ng-model="channel" placeholder="Enter Channel" ng-keydown="$event.which === 13 && cname(channel)"/>

JS:

.factory('ytVids', function($http){

    return{
        getChannel: function(name){
            var url = 'https://www.googleapis.com/youtube/v3/channels? part=contentDetails&forUsername='+ name +'&key=[my api key]';
            return $http.get(url);
        },
        getVids: function(channel){
            return    $http.get('https://www.googleapis.com/youtube/v3/playlistItems?part=snippet%2CcontentDetails&maxResults=50&playlistId='+channel+'&key=[my api key]');

        }
    };
  })
  .controller('MainCtrl', function ($scope, ytVids) {
     $scope.cname = function(channel){
        ytVids.getChannel(channel).success(function(response){
            //console.log(response);
            console.log(response.items[0].contentDetails.relatedPlaylists.uploads);
            ytVids.getVids(response.items[0].contentDetails.relatedPlaylists.uploads)
            .success(function(data){
                console.log('in success');
                console.log(data.items);
                $scope.ytChannel = data.items; // This is the scope that is not seeming to want to work. 
            });
        });
    };
  });

这里是 html 调用 ytChannel

<ul>
  <li ng-repeat="item in ytChannel" class="col-xs-12 col-sm-6 col-md-4 vid-options">
    <a href="#">
      <div class="title">{{item.snippet.title}}</div>
      <img src="{{item.snippet.thumbnails.maxres.url}}" />
    </a>
  </li>
</ul>

如果范围在函数中，html 是否无法访问它？我可以做什么才能访问返回的数据？

错误

这是控制台在开发工具中给出的错误
GET http://localhost:9000/%7B%7Bitem.snippet.thumbnails.maxres.url%7D%7D 404 (Not Found)

Answer 1

正确的代码是

<img ng-src="{{item.snippet.thumbnails.maxres.url}}" />

作为手册 says,

Using Angular markup like {{hash}} in a src attribute doesn't work right: The browser will fetch from the URL with the literal text {{hash}} until Angular replaces the expression inside {{hash}}. The ngSrc directive solves this problem.

AngularJS 功能范围似乎不起作用

AngularJS scope in function does not seem to be working

javascript

service

factory

controller

angularjs

错误