小编Jos*_*osh的帖子

我对angularjs很新.我试图理解为什么使用这个指令比使用控制器更好.两个示例都输出相同的值.

指令示例:

angular.module('docsSimpleDirective', [])
.controller('Controller', ['$scope', function($scope) {
  $scope.customer = {
    name: 'Naomi',
    address: '1600 Amphitheatre'
  };
}])
.directive('myCustomer', function() {
  return {
    template: 'Name: {{customer.name}} Address: {{customer.address}}'
  };
});

标记:

<div ng-controller="Controller">
  <div my-customer></div>
</div>

控制器示例:

angular.module('docsSimpleDirective', [])
    .controller('Controller', ['$scope', function($scope) {
      $scope.customer = {
        name: 'Naomi',
        address: '1600 Amphitheatre'
      };
    }])

标记:

<div ng-controller="Controller">
   Name: {{customer.name}} Address: {{customer.address}}     
 </div>

也许我只是不完全理解指令.

我正在尝试使用 Angular 创建我的第一个滑块。我收到的错误通知我 $watch 可能无法正确注入。以下是错误：

Error: [$injector:unpr] http://errors.angularjs.org/1.4.4/$injector/unpr?p0=%24watchProvider%20%3C-%20%24watch%20%3C-%20sliderCtrl
    at Error (native)
    at http://localhost:9999/bower_components/angular/angular.min.js:6:416
    at http://localhost:9999/bower_components/angular/angular.min.js:40:307
    at Object.d [as get] (http://localhost:9999/bower_components/angular/angular.min.js:38:308)
    at http://localhost:9999/bower_components/angular/angular.min.js:40:381
    at d (http://localhost:9999/bower_components/angular/angular.min.js:38:308)
    at Object.e [as invoke] (http://localhost:9999/bower_components/angular/angular.min.js:39:64)
    at b.$get.Q.instance (http://localhost:9999/bower_components/angular/angular.min.js:80:151)
    at K (http://localhost:9999/bower_components/angular/angular.min.js:61:140)
    at http://localhost:9999/bower_components/angular/angular.min.js:68:475

当我点击错误链接时：

Unknown provider: $watchProvider <- $watch <- sliderCtrl

控制器：

myApp.controller('sliderCtrl', ['$scope', '$watch', function($scope, $watch){
    // Create an array of slide images
    $scope.sliderImages = [
        { image: '../../public/assets/img/joker2.jpg', description: 'Image 1' },
        { image: '../../public/assets/img/batman1.jpg', description: 'Image 2' },
        { image: …

我正在尝试更熟悉Javascript中的回调函数.我创建了一个简单的应用程序来将新成员推送到开发团队阵列.我正在尝试使用addDev函数作为我的回调练习.我收到一个错误:Uncaught TypeError: addDev is not a function.

var devTeam = [];

function devMember(fName, lName, addDev){
    this.firstName = fName;
    this.lastName = lName;
    this.fullName = firstName + " " + lastName;
    addDev(fullName);
}

function addDev(member){
    devTeam.push(member);
    console.log(devTeam);
}

devMember('Jay', 'Spears');

我在按钮上设置一个简单的属性,并尝试在DOM中显示它......我不明白我做错了什么.我明白了Click Me! Current numer is,但不是Click Me! Current numer is 1.我不得不遗漏一些东西？没有错误.

class TestElement extends Component {
    render(){
        return (
            <div>
                <Header />
                <div>
                    <button currentNumber={1}>Click Me! Current numer is {this.props.currentNumber}</button>
                </div>
                <Footer />
            </div>
        );
    }
}

我知道我们可以在JavaScript中将数组值与indexOf匹配.如果匹配则不会返回-1.

var test = [
    1, 2, 3
]

// Returns 2
test.indexOf(3);

有没有办法匹配对象？例如？

var test = [
    {
        name: 'Josh'
    }
]

// Would ideally return 0, but of course it's -1.
test.indexOf({ name: 'Josh' });

我只是使用Github的API抓取我的Github信息.当我记录我的http请求时,它会显示正确的信息..我不知道为什么它没有显示在页面上.我没有收到任何错误.(部分显示,而不是请求的数据)

服务:

myApp.factory('githubApi', ['$http',
    function($http) {
        //Declaring a promise that will or will not return a users github information.
        return {
            async: function() {
                return $http.get('https://api.github.com/users/joshspears3');
            }
        }
    }
]);

控制器:

myApp.controller('githubCtrl', [ 'githubApi', '$scope',
    function(githubApi, $scope){
        $scope.data = githubApi.async();
    }
]);

指令:

myApp.directive('githubRequest', [
    function() {
        return {
            scope: {},
            restrict: 'E',
            controller: 'githubCtrl',
            templateUrl: 'public/views/partials/github-request.html'
        }
    }
]);

github-request.html(部分):

<p class="component-example-header">Creating a service. Grabbing information based on the github API.</p>
<div>
    Making a $http …