hh54188
hh54188

Reputation: 15656

Confuse about angular custom directive scope inherit

I define a custom directive in a controller, I have already define some variable in the controller's $scope.

    myapp.controller('demoController', function ($scope) {
        $scope.userInput = "Hello World";
    });

    myapp.directive('custom', function () {
        return {
            template: '<input type="text" ng-model="userInput" value="{{userInput}}" />'
        }
    });

the html:

    <div controller="demoController">
    <custom></custom>   

I thought the custom directive could inherit the parent contoller's $scope, so it could access to the userInput variable. But when page render out, nothing happened. the input element show nothing.

Should not the custom directive inherit the parent's scope? How can make it right?

Upvotes: 0

Views: 61

Answers (1)

harishr
harishr

Reputation: 18065

change your div to use ng-controller

  <div ng-controller="demoController">

Upvotes: 2

Related Questions