How to include one partial into other without creating a new scope?

Question

I\'ve this routes.

// index.html

    One
    Two
         


        
                      

              相关标签:
       
      

Answer 1

The documentation for ngInclude states "This directive creates new scope." so this is by design.

Depending on the type of interaction you are looking for you may want to take a look at this post for one way to share data/functionality between the two controllers via a custom service.

Answer 2

So this isn't an answer to this question but i made it here looking for something similar and hopefully this will help others.

This directive will include a partial without creating a new scope. For an example you can create a form in the partial and control that form from the parent controller.

Here is a link to the Repo that i created for it.

good luck :-)

-James Harrington

Answer 3

You can write your own include directive that does not create a new scope. For example:

MyDirectives.directive('staticInclude', function($http, $templateCache, $compile) {
    return function(scope, element, attrs) {
        var templatePath = attrs.staticInclude;
        $http.get(templatePath, { cache: $templateCache }).success(function(response) {
            var contents = element.html(response).contents();
            $compile(contents)(scope);
        });
    };
});

You can use this like:

<div static-include="my/file.html"></div>

Answer 4

You can actually do this without using a shared service. $scope.$emit(...) can dispatch events to the $rootScope, which can listen for them and rebroadcast to the child scopes.

Demo: http://jsfiddle.net/VxafF/

Reference: http://www.youtube.com/watch?v=1OALSkJGsRw (see the first comment)