Angular.js: ng-transclude рдХреЛ рдирдП рд╕рд┐рдмрд▓рд┐рдВрдЧ рд╕реНрдХреЛрдк рдирд╣реАрдВ рдмрдирд╛рдирд╛ рдЪрд╛рд╣рд┐рдПред

рдХреЛ рдирд┐рд░реНрдорд┐рдд 20 рджрд┐рд╕ре░ 2013  ┬╖  69рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ  ┬╖  рд╕реНрд░реЛрдд: angular/angular.js

рдпрд╣ рдПрдХ рдкрд░рд┐рд╡рд░реНрддрди рдЕрдиреБрд░реЛрдз рд╣реИ рдФрд░ рдореИрдВ рдпрд╣ рджреЗрдЦрдирд╛ рдЪрд╛рд╣реВрдВрдЧрд╛ рдХрд┐ рдЕрдиреНрдп рд▓реЛрдЧ рдХреНрдпрд╛ рд╕реЛрдЪрддреЗ рд╣реИрдВред

рдореЗрд░реА рд╡рд┐рдирдореНрд░ рд░рд╛рдп рдореЗрдВ рдПрдирдЬреА-рдЯреНрд░рд╛рдВрд╕рдХреЙрд▓реНрдпреВрдб рдХреЛ рдЕрдкрдирд╛ рджрд╛рдпрд░рд╛ рдирд╣реАрдВ рдмрдирд╛рдирд╛ рдЪрд╛рд╣рд┐рдП рдпрд╛ рдХрдо рд╕реЗ рдХрдо рдРрд╕рд╛ рдХрд░рдиреЗ рд╕реЗ рд░реЛрдХрдиреЗ рдХрд╛ рдХреЛрдИ рддрд░реАрдХрд╛ рдирд╣реАрдВ рд╣реЛрдирд╛ рдЪрд╛рд╣рд┐рдПред рдЗрд╕рдХреЗ рдкреАрдЫреЗ рдХрд╛рд░рдг рдпрд╣ рд╣реИ рдХрд┐ рдПрдХ рдирд┐рд░реНрджреЗрд╢ рдЬреЛ рдкрд╣рд▓реЗ рд╕реЗ рд╣реА рд╕реНрдерд╛рдирд╛рдВрддрд░рдг рдХрд╛ рдЕрдиреБрд░реЛрдз рдХрд░рддрд╛ рд╣реИ, рдХрд╛ рдпрд╣ рдирд┐рд░реНрджрд┐рд╖реНрдЯ рдХрд░рдиреЗ рдХрд╛ рдорддрд▓рдм рд╣реИ рдХрд┐ рдЗрд╕рдореЗрдВ рдЧреБрдВрдЬрд╛рдЗрд╢ рд╣реИ рдпрд╛ рдЕрд▓рдЧ-рдЕрд▓рдЧ рдЧреБрдВрдЬрд╛рдЗрд╢ рд╣реИ рдпрд╛ рдХреЛрдИ рдЧреБрдВрдЬрд╛рдЗрд╢ рдирд╣реАрдВ рд╣реИред рдпрд╣ рдПрдирдЬреА-рдЯреНрд░рд╛рдВрд╕рдХреНрд▓реВрдб рдбрд╛рдпрд░реЗрдХреНрдЯрд┐рд╡ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рддрд╛ рд╣реИ рддрд╛рдХрд┐ рдпрд╣ рдЪрд┐рдиреНрд╣рд┐рдд рдХрд┐рдпрд╛ рдЬрд╛ рд╕рдХреЗ рдХрд┐ рд╡рд╣ рд╕рд╛рдордЧреНрд░реА рдХрд╣рд╛рдБ рдбрд╛рд▓рдирд╛ рдЪрд╛рд╣рддрд╛ рд╣реИред рдЬрдм рдПрдирдЬреА-рдЯреНрд░рд╛рдВрд╕рдХреЙрд▓реНрдпреВрдб рд╕реНрд╡рдпрдВ рдХрд╛ рд╕рд┐рдмрд▓рд┐рдВрдЧ рд╕реНрдХреЛрдк рдмрдирд╛рддрд╛ рд╣реИ рддреЛ рдпрд╣ рдЙрд╕ рддрд░рд╣ рдХреЗ рдирд┐рд░реНрджреЗрд╢ рдХреА рдЕрдкреЗрдХреНрд╖рд╛рдУрдВ рдХреЛ рддреЛрдбрд╝рддрд╛ рд╣реИ рдЬреЛ рдкрд░рд┐рднрд╛рд╖рд┐рдд рдХрд░рддрд╛ рд╣реИ рдХрд┐ рдпрд╣ рдХрд┐рд╕ рддрд░рд╣ рдХрд╛ рджрд╛рдпрд░рд╛ рдЪрд╛рд╣рддрд╛ рд╣реИ рдФрд░ рдЗрд╕рдореЗрдВ рд▓реЛрдХрдкреНрд░рд┐рдп 'рдореВрд▓реНрдп' рдмрдирд╛рдо 'рдСрдмреНрдЬреЗрдХреНрдЯ.рд╡рд▓реНрдпреВ' рднреНрд░рдо рдХреА рдЕрднрд┐рд╡реНрдпрдХреНрддрд┐ рдЖрддреА рд╣реИред

рдпрд╣рд╛рдБ рдПрдХ рдЙрджрд╛рд╣рд░рдг рд╣реИ рдЬрд╣рд╛рдБ рдирдП рджрд╛рдпрд░реЗ рдХрд╛ рдореЗрд░реА рд░рд╛рдп рдореЗрдВ рдХреЛрдИ рдорддрд▓рдм рдирд╣реАрдВ рд╣реИ:

ui.directive('box', function() {
    return {
        restrict: 'E',
        transclude: true,
        template: '<div ng-transclude/>',
        replace: true,
        scope: {}
    };
});

рдпрд╣ рд╕рднреА рдирд┐рд░реНрджреЗрд╢ рдЪрд╛рд╣рддреЗ рд╣реИрдВ рдХрд┐ <box>content</box> <div>content</div> рдФрд░ рд╕рд╛рдордЧреНрд░реА рдХреЛ рдЕрд▓рдЧ-рдЕрд▓рдЧ рд╕реНрдХреЛрдк рдХреЗ рд╕рд╛рде рдкреНрд░рддрд┐рд╕реНрдерд╛рдкрд┐рдд рдХрд┐рдпрд╛ рдЬрд╛рдПред

рдЗрд╕ рддрд░рд╣ рдХреЗ рдирд┐рд░реНрджреЗрд╢реЛрдВ рдХреА рдиреЗрд╕реНрдЯреЗрдб рд╕рдВрд░рдЪрдирд╛ рдмрдирд╛рдиреЗ рд╕реЗ рдПрдХ рджрд╛рдпрд░реЗ рдХрд╛ рдкреЗрдбрд╝ рдкреНрд░рджреВрд╖рдг рд╣реЛрддрд╛ рд╣реИред рдпрд╣рд╛рдВ рддреАрди рдиреЗрд╕реНрдЯреЗрдб рдирд┐рд░реНрджреЗрд╢реЛрдВ рдХрд╛ рдПрдХ рдкреНрд▓рдВрдХреЗрд░ рдЙрджрд╛рд╣рд░рдг (http://plnkr.co/edit/DwukVGGprFFjQuVY8yTz) рджрд┐рдпрд╛ рдЧрдпрд╛ рд╣реИ, рдЬреЛ рдЗрд╕ рдкреНрд░рдХрд╛рд░ рдПрдХ рд╕реНрдХреЛрдк рдЯреНрд░реА рд╕рдВрд░рдЪрдирд╛ рдмрдирд╛рддреЗ рд╣реИрдВ:

< Scope (002) : ng-app
    < Scope (003) : ng-controller
        < Scope (004) : box
        < Scope (005) : ng-transclude
            < Scope (006) : box
            < Scope (007) : ng-transclude
                < Scope (008) : box
                < Scope (009) : ng-transclude

рдпрд╣ рд╡реНрдпрд╡рд╣рд╛рд░ рдЕрдкрдиреЗ рдЙрджреНрджреЗрд╢реНрдп рдХреЗ рд▓рд┐рдП рдХреЛрдИ рдореВрд▓реНрдп рдирд╣реАрдВ рдЬреЛрдбрд╝рддрд╛ рд╣реИ, рд▓реЗрдХрд┐рди рд╢реБрд░реБрдЖрддреА рд▓реЛрдЧреЛрдВ рдХреЗ рдмреАрдЪ рдмрд╣реБрдд рднреНрд░рдо рдкреИрджрд╛ рдХрд░рддрд╛ рд╣реИред

рдлрд┐рд▓рд╣рд╛рд▓ рдореИрдВ рдирд┐рдореНрдирд▓рд┐рдЦрд┐рдд рд╡рд░реНрдХрдЕрд░рд╛рдЙрдВрдб рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рддрд╛ рд╣реВрдВ рдЬреЛ рдХрд┐ рдкрд┐рдЫрд▓реЗ рдЙрджрд╛рд╣рд░рдг рд╕реЗ рд╡рд╛рд╕реНрддрд╡ рдореЗрдВ рдкреНрд░рд╛рдкреНрдд рд╣реЛрддрд╛ рд╣реИ:

ui.directive('box', function() {
    return {
        restrict: 'E',
        transclude: true,
        template: '<div/>',
        replace: true,
        scope: {},
        link: function(scope, element, attrs, transclude) {
            transclude(scope.$parent, function(content) {
                element.append(content);
            });
        }
    };
});

рдпрд╣рд╛рдВ рдПрдХ рдкреНрд▓рдВрдХрд░ рдЙрджрд╛рд╣рд░рдг (http://plnkr.co/edit/46v6IBLkhS71L1WbUDFl) рджрд┐рдпрд╛ рдЧрдпрд╛ рд╣реИ рдЬреЛ рдЗрд╕ рдЕрд╡рдзрд╛рд░рдгрд╛ рдХреЛ рджрд░реНрд╢рд╛рддрд╛ рд╣реИред рдпрд╣ рдЧреБрдВрдЬрд╛рдЗрд╢ рдкреЗрдбрд╝ рдЕрдЪреНрдЫрд╛ рдФрд░ рд╕реБрд╡реНрдпрд╡рд╕реНрдерд┐рдд рдЫреЛрдбрд╝ рджреЗрддрд╛ рд╣реИ:

< Scope (002) : ng-app
    < Scope (003) : ng-controller
        < Scope (004) : box
        < Scope (005) : box
        < Scope (006) : box

рдФрд░ 2-рд╡реЗ рдмрд╛рдЗрдВрдбрд┐рдВрдЧ 'рдСрдмреНрдЬреЗрдХреНрдЯ.рд╡рд▓реНрдпреВ' рдХреЗ рдмрдЬрд╛рдп 'рд╡реИрд▓реНрдпреВ' рдХреЛ рдмрд╛рдВрдзрдиреЗ рдкрд░ рдХрдИ рддрд░рд╣ рд╕реЗ рдЙрдореНрдореАрдж рдХрд░рддреА рд╣реИред (рдореЗрд░рд╛ рдорд╛рдирдирд╛ тАЛтАЛрд╣реИ рдХрд┐ рдХреБрдЫ рдорд╛рдорд▓реЛрдВ рдореЗрдВ рд╕рд┐рд░реНрдл 'рдорд╛рди' рдкрд╛рд╕ рдХрд░рдиреЗ рдХрд╛ рдХрд╛рдо рдХрд╛рдо рдХрд░рддрд╛ рд╣реИ, рд▓реЗрдХрд┐рди рджреВрд╕рд░реЗ рдХрд╛ рдирд╣реАрдВ рдФрд░ рдЬрд╛рд╡рд╛рд╕реНрдХреНрд░рд┐рдкреНрдЯ рдореЗрдВ рдкреНрд░реЛрдЯреЛрдЯрд╛рдЗрдк рдХреА рд╡рд┐рд░рд╛рд╕рдд рдХреА рдкреНрд░рдХреГрддрд┐ рдХреЛ рджреЛрд╖ рджреЗрдирд╛ рдПрдХ рдЕрдЪреНрдЫрд╛ рдмрд╣рд╛рдирд╛ рдирд╣реАрдВ рд╣реИред рддрдереНрдп рдпрд╣ рд╣реИ рдХрд┐ рдмрд╣реБрдд рд╕реЗ рд▓реЛрдЧ рдЗрд╕ рд╡реНрдпрд╡рд╣рд╛рд░ рдХреЛ рдЕрдкреНрд░рддреНрдпрд╛рд╢рд┐рдд рдкрд╛рддреЗ рд╣реИрдВ рдХрд┐ рдпрд╣ рд╡рд╛рд╕реНрддреБ рджреЛрд╖ рд╣реИред ред)

рдореИрдВ рдпрд╣ рд╕реБрдирдирд╛ рдкрд╕рдВрдж рдХрд░реВрдВрдЧрд╛ рдХрд┐ рджреВрд╕рд░реЗ рд▓реЛрдЧ рдХреНрдпрд╛ рд╕реЛрдЪрддреЗ рд╣реИрдВ рдФрд░ рдРрд╕реЗ рдорд╛рдорд▓реЛрдВ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рддреЗ рд╣реИрдВ, рдЬрд╣рд╛рдВ рдЙрдиреНрд╣реЗрдВ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдПрдирдЬреА-рдЯреНрд░рд╛рдВрд╕рдХреНрд▓реВрдб рдХреЗ рд▓рд┐рдП рдПрдХ рдирдпрд╛ рд╕рд┐рдмрд▓рд┐рдВрдЧ рд╕реНрдХреЛрдк рдмрдирд╛рдиреЗ рд╕реЗ рд╕рдордЭ рдореЗрдВ рдЖрддрд╛ рд╣реИред

Lots of comments $compile high won't fix bug

рд╕рдмрд╕реЗ рдЙрдкрдпреЛрдЧреА рдЯрд┐рдкреНрдкрдгреА

рдЕрдЪреНрдЫреА рдмрд╛рдд рд╣реИ рдХрд┐ рдореИрдВ рд╕рд╛рд▓реЛрдВ рдкрд╣рд▓реЗ рдПрдореНрдмрд░ рдореЗрдВ рдмрджрд▓ рдЧрдпрд╛ред :)

рд╕рднреА 69 рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

Transclude рдПрдХ рдирдпрд╛ рджрд╛рдпрд░рд╛ рдХрд╣рд╛рдБ рдмрдирд╛рддрд╛ рд╣реИ? http://plnkr.co/edit/EuHaBR26JgAegQKvwOGH?p=preview рдореИрдВ рдЗрд╕реЗ рдирд╣реАрдВ рджреЗрдЦ рд░рд╣рд╛ рд╣реВрдБ

рдореИрдВ рдПрдирдЬреА-рдЯреНрд░рд╛рдВрд╕рдХрд▓реНрдбреА рдирд┐рд░реНрджреЗрд╢ рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рдмрд╛рдд рдХрд░ рд░рд╣рд╛ рд╣реВрдВред рдЖрдкрдХреЗ рдкрд╛рд╕ рдЖрдкрдХреЗ рдЙрджрд╛рд╣рд░рдг рдореЗрдВ рд╡рд╣реА рд╣реИ рдЬреЛ рдореЗрд░реЗ рдЖрд╕рдкрд╛рд╕ рдХрд╛рдо рдХрд░рддрд╛ рд╣реИред

рдпрд╣ рдПрдХ рд╡реИрдз рдЕрдиреБрд░реЛрдз рд╣реИред рд╣рдо 1.2 рдХреЗ рд▓рд┐рдП рдЗрд╕ рдкрд░ рд╡рд┐рдЪрд╛рд░ рдХрд░ рд░рд╣реЗ рдереЗ, рд▓реЗрдХрд┐рди рдпрд╣ рдЕрдВрддрд┐рдо рд░рд┐рд▓реАрдЬ рдХреЗ рдХрд░реАрдм рд╣реЛ рд░рд╣рд╛ рдерд╛ рдФрд░ рдЗрд╕ рдмреНрд░реЗрдХрд┐рдВрдЧ рдкрд░рд┐рд╡рд░реНрддрди рдХреЛ рдкреЗрд╢ рдирд╣реАрдВ рдХрд░рдирд╛ рдЪрд╛рд╣рддрд╛ рдерд╛ред

рд╣рдореЗрдВ рдЗрд╕реЗ 1.3 рдХреЗ рд▓рд┐рдП рд╡рд┐рдЪрд╛рд░ рдХрд░рдирд╛ рдЪрд╛рд╣рд┐рдП

рдЕрдЪреНрдЫрд╛ рд╣реИ! рдореБрдЭреЗ рдЦреБрд╢реА рд╣реИ рдХрд┐ рдЖрдк рдкрд╣рд▓реЗ рд╕реЗ рд╣реА рдЗрд╕ рдкрд░ рд╡рд┐рдЪрд╛рд░ рдХрд░ рд░рд╣реЗ рд╣реИрдВред

рдЗрд╕рдХреЗ рд▓рд┐рдП +1ред рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдореЗрд░рд╛ рдореБрджреНрджрд╛ рдЗрд╕ рд╕реЗ рд╕рдВрдмрдВрдзрд┐рдд рд╣реИ: рдореИрдВ рд░реВрдкреЛрдВ рдХреЗ рд╕рд╛рде рдПрдХ рдирд┐рд░реНрджреЗрд╢ рдореЗрдВ рдПрдирдЬреА-рдЯреНрд░рд╛рдВрд╕рдХреНрд▓реВрдб рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рддрд╛ рд╣реВрдВ рдФрд░ рдореБрдЭреЗ рдЗрд╕рдХреЗ рджрд╛рдпрд░реЗ рдореЗрдВ рдЬрд╛рдирд╛ рдкрдбрд╝рддрд╛ рд╣реИред рдлреЙрд░реНрдо рдорд╛рдиреНрдпрддрд╛ рдСрдмреНрдЬреЗрдХреНрдЯ рддрдХ рдкрд╣реБрдВрдЪрдиреЗ рдХреЗ рд▓рд┐рдП $$ рдмрдЪрдХрд╛рдирд╛ рд╣реИ, рд▓реЗрдХрд┐рди рдореЗрд░реЗ рдкрд╛рд╕ рдЕрдкрдиреЗ рдореЙрдбрд▓ рддрдХ рдкрд╣реБрдВрдЪрдиреЗ рдХреЗ рд▓рд┐рдП рдХреЛрдИ рд╕рдорд╕реНрдпрд╛ рдирд╣реАрдВ рд╣реИред

рдпрд╣рд╛рдБ рдПрдХ рдЙрджрд╛рд╣рд░рдг рд╣реИ: http://fiddle.jshell.net/39cgW/3/

+1 рдЖрдЬ рдЗрд╕ рдореБрджреНрджреЗ рдкрд░ рдЪрд▓ рд░рд╣рд╛ рд╣реИ рдФрд░ рдореБрдЭреЗ рд╣рд░ рдЬрдЧрд╣ $parent рдлреЗрдВрдХрдиреЗ рд╕реЗ рдирдлрд░рдд рд╣реИред

рдЗрд╕рд▓рд┐рдП, рдЗрд╕рдХреЗ рд▓рд┐рдП рдПрдХ рд╕рдорд╛рдзрд╛рди рдЦреЛрдЬрдиреЗ рдХреЗ рд▓рд┐рдП, рдРрд╕рд╛ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рджреЛ рд╕рдВрднрд╛рд╡рдирд╛рдПрдВ рд╣реИрдВ

1) рдЕрдкрдиреЗ рджрд╛рдпрд░реЗ рдХреЛ рдирд┐рд░реНрджрд┐рд╖реНрдЯ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП ngTransclude рдирд┐рд░реНрджреЗрд╢ рдХреЛ рдмрджрд▓ рджреЗрдВ (рдпрд╣ рд╡рд╛рд╕реНрддрд╡ рдореЗрдВ рдЗрд╕рд╕реЗ рдХрд╛рдлреА рдиреАрдЪреЗ рд╕рд┐рдХреБрдбрд╝ рд╕рдХрддрд╛ рд╣реИ, рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ --- рдХреЛрдИ рдирд┐рдпрдВрддреНрд░рдХ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рдирд╣реАрдВ рд╣реИ)

рдпрд╛

2) рдЬрдм рдЧреБрдВрдЬрд╛рдЗрд╢ рдирд┐рд░реНрджрд┐рд╖реНрдЯ рдирд╣реАрдВ рд╣реИ рддреЛ рдПрдХ рдирдпрд╛ рджрд╛рдпрд░рд╛ рди рдмрдирд╛рдПрдВ

рдЗрд╕рд▓рд┐рдП, рд╣рдо рд╡рд┐рдХрд▓реНрдк 1 рдХреЗ рд╕рд╛рде рдХреБрдЫ рдмрд╛рдЗрдЯреНрд╕ рдмрдЪрд╛ рд╕рдХрддреЗ рд╣реИрдВ) рдФрд░ рдпрд╣ рдЕрдЪреНрдЫрд╛ рд╣реИ, 2) рд╕рдмрд╕реЗ рдЫреЛрдЯрд╛ рд╕рдорд╛рдзрд╛рди рд╣реЛрдЧрд╛ (3 рд▓рд╛рдЗрди рд╡рд┐рд▓реЛрдкрди рдпрд╛ рддреЛ) рдФрд░ рдпрд╣ рдореЗрд░реЗ рд▓рд┐рдП рд╕реНрдкрд╖реНрдЯ рдирд╣реАрдВ рд╣реИ рдХрд┐ рдРрд╕реЗ рдорд╛рдорд▓реЛрдВ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░реЗрдВ рдЬрд╣рд╛рдВ рдПрдХ рдирдпрд╛ рдЧреБрдВрдЬрд╛рдЗрд╢ рдмрдирд╛рдиреЗ рдХрд╛ рдЕрд░реНрде рд╕реНрдкрд╖реНрдЯ рд░реВрдк рд╕реЗ рд╡рд╣рд╛рдВ рд╣реИ ( рд╢рд╛рдпрдж рд╡рд╣рд╛рдБ рд╣реИрдВ, рд▓реЗрдХрд┐рди рдпрд╣ рдкреВрд░реА рддрд░рд╣ рд╕реЗ рд╡рд┐рдкрд░реАрдд рд╣реИ рдЬрд┐рд╕ рддрд░рд╣ рд╕реЗ рдбреЙрдХреНрд╕ рдореЗрдВ рд╕реНрдерд╛рдирд╛рдиреНрддрд░рдг рдХреЛ рд╡рд░реНрдгрд┐рдд рдХрд┐рдпрд╛ рдЧрдпрд╛ рд╣реИ)


рдпрд╛, рдпрджрд┐ рдЖрдк рд╕реБрдкрд░ рдлреИрдВрд╕реА рд╣реЛрдирд╛ рдЪрд╛рд╣рддреЗ рдереЗ, рддреЛ рд╢рд╛рдпрдж рдЖрдк рдПрдирдЬреАрдЯреНрд░рд╛рдВрд╕рдХрд▓реНрдбреА рдХреЛ рдпрд╣ рдирд┐рд░реНрджрд┐рд╖реНрдЯ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдкреВрд░реА рддрд░рд╣ рд╕реЗ рдкрд░рд┐рд╡рд░реНрддрдиреЛрдВ рдХреЛ рддреЛрдбрд╝рдиреЗ рд╕реЗ рдмрдЪрд╛ рд╕рдХрддреЗ рдереЗ рдХрд┐ рдпрд╣ рд╡рд┐рд╢реЗрд╖рддрд╛ рдорд╛рди рдХреЗ рдорд╛рдзреНрдпрдо рд╕реЗ рдПрдХ рдирдпрд╛ рджрд╛рдпрд░рд╛ рдЪрд╛рд╣рддрд╛ рд╣реИ рдпрд╛ рдирд╣реАрдВред

рд╡рд┐рдЪрд╛рд░?

рдореБрдЭреЗ рдЖрдкрдХреЗ 1 рдФрд░ 2 рдХреЗ рдмреАрдЪ рдЕрдВрддрд░ рдирд╣реАрдВ рдорд┐рд▓рддрд╛ рд╣реИ!

рдмрд╕ рдореЗрд░реА рд░рд╛рдп рд╣реИ, рд▓реЗрдХрд┐рди рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдЗрд╕ рдмрджрд▓рд╛рд╡ рдХреЗ рд▓рд┐рдП рдкреАрдЫреЗ рдХреА рд╕рдВрдЧрддрддрд╛ рдорд╣рддреНрд╡рдкреВрд░реНрдг рд╣реЛрдЧреАред рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рд╡рд╣рд╛рдБ рдмрд╣реБрдд рд╕рд╛рд░реЗ рдРрдк рд╣реИрдВ (рдореЗрд░рд╛ рд╢рд╛рдорд┐рд▓ рд╣реИ) рдЬрд┐рдиреНрд╣реЛрдВрдиреЗ рдЗрд╕ рдЧреБрдВрдЬрд╛рдЗрд╢ рдХреЗ рдореБрджреНрджреЗ рдкрд░ $ рдкреЗрд░реЗрдВрдЯ рдФрд░ рд╕реНрдХреЛрдк рдЬреИрд╕реА рдЪреАрдЬреЛрдВ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдХреЗ рдХрд╛рдо рдХрд┐рдпрд╛ рд╣реИред $$ рдмрдЪрдХрд╛рдирд╛ред рдХреЛрдИ рднреА рдЕрдкрдбреЗрдЯ рдЬреЛ рдЗрд╕ рд╡реНрдпрд╡рд╣рд╛рд░ рдХреЛ рдмрджрд▓ рджреЗрддрд╛ рд╣реИ, рдХреБрдЫ рд╕рд┐рд░рджрд░реНрдж рдХрд╛ рдХрд╛рд░рдг рдмрди рдЬрд╛рдПрдЧрд╛ (рд▓реЗрдХрд┐рди рд╢рд╛рдпрдж рдпрд╣ рдмрд╛рдж рдореЗрдВ рдХреА рддреБрд▓рдирд╛ рдореЗрдВ рдЬрд▓реНрдж рд╣реА рд╕рд┐рд░рджрд░реНрдж рдкреИрджрд╛ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдмреЗрд╣рддрд░ рд╣реИ)ред

рдЙрд╕ рдиреЗ рдХрд╣рд╛, рдПрдХ рд╕реИрджреНрдзрд╛рдВрддрд┐рдХ рджреГрд╖реНрдЯрд┐рдХреЛрдг рд╕реЗ, рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдпрд╣ рдПрдирдЬреА-рдЯреНрд░рд╛рдВрд╕рдХреНрд▓реВрдб рдХреЗ рд▓рд┐рдП рдФрд░ рдЕрдзрд┐рдХ рд╕рдордЭ рдореЗрдВ рдЖрддрд╛ рд╣реИ рдХреНрдпреЛрдВрдХрд┐ рдбрд┐рдлрд╝реЙрд▓реНрдЯ рд░реВрдк рд╕реЗ рдирд┐рд░реНрджреЗрд╢ рдХреЗ рд╕рдорд╛рди рд╣реИред рд╕рд╛рдордЧреНрд░реА рдХреЛ рд╕реНрдерд╛рдирд╛рдВрддрд░рд┐рдд рдХрд░рдиреЗ рдХреА рдмрд╛рдд рдпрд╣ рд╣реИ рдХрд┐ рдЖрдк рдЗрд╕реЗ рд╕рд╛рдордЧреНрд░реА рдХрд╛ рдПрдХ рд╕рд╣рдЬ рд╣рд┐рд╕реНрд╕рд╛ рдЪрд╛рд╣рддреЗ рд╣реИрдВред рдРрд╕реЗ рд╕рдордп рд╣реЛрддреЗ рд╣реИрдВ рдЬрдм рдореЗрд░реЗ рдкрд╛рд╕ рдЯреНрд░рд╛рдВрд╕рдХреЙрд▓реНрдбреНрд╕ рдХреЗ рд╕рд╛рде рдирд┐рд░реНрджреЗрд╢реЛрдВ рдХреЗ рдмрд╣реБрдд рд╕рд╛рд░реЗ рдШреЛрдВрд╕рд▓реЗ рдХреЗ рд╢рд┐рдХрд╛рд░ рд╣реЛрддреЗ рд╣реИрдВ, рд▓реЗрдХрд┐рди рдореИрдВ рдЕрднреА рднреА рдЙрдиреНрд╣реЗрдВ рдПрдХ рдмрдбрд╝реЗ рдШрдЯрдХ рдХреЗ рд░реВрдк рдореЗрдВ рд╡реНрдпрд╡рд╣рд╛рд░ рдХрд░рдирд╛ рдЪрд╛рд╣рддрд╛ рд╣реВрдВред рд╕рднреА рдЕрд▓рдЧ-рдЕрд▓рдЧ рд╕реНрдХреЛрдк рдХреЗ рд╕рд╛рде рд╣реЛрдиреЗ рд╕реЗ рдпрд╣ рдмрд╣реБрдд рдореБрд╢реНрдХрд┐рд▓ рд╣реЛ рдЬрд╛рддрд╛ рд╣реИред

рд╕рдм рд╕рд┐рд░реНрдл рдореЗрд░реЗ рд╡рд┐рдЪрд╛рд░ред рдмрд╣реБрдд рдХрдо рд╕реЗ рдХрдо, рдХреЗрд╡рд▓ рд╡рд┐рдХрд▓реНрдк рд╣реЛрдиреЗ рд╕реЗ рд╡рд░реНрддрдорд╛рди рд╕реНрдерд┐рддрд┐ рд╕реЗ рдПрдХ рдХрджрдо рдКрдкрд░ рд╣реЛрдЧрд╛ред :)

рд╕реНрдкрд╖реНрдЯ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП @troch , рд╣рдо ngTranscludeDirective рдХреЗ рдирд┐рдпрдВрддреНрд░рдХ рдореЗрдВ рдирд┐рдореНрдирд▓рд┐рдЦрд┐рдд рдЗрдВрдЬреЗрдХреНрд╖рди рдХрд░рддреЗ рд╣реИрдВ:

        // This is the function that is injected as `$transclude`.
        function controllersBoundTransclude(scope, cloneAttachFn) {
          var transcludeControllers;

          // no scope passed
          if (arguments.length < 2) {
            cloneAttachFn = scope;
            scope = undefined;
          }

          if (hasElementTranscludeDirective) {
            transcludeControllers = elementControllers;
          }

          return boundTranscludeFn(scope, cloneAttachFn, transcludeControllers);
        }

рдирд┐рд░реНрджреЗрд╢ рдЗрд╕ рдлрд╝рдВрдХреНрд╢рди рдХреЛ рдмрд┐рдирд╛ рдХрд┐рд╕реА рдЧреБрдВрдЬрд╛рдЗрд╢ рдХреЗ рдХрд╣рддрд╛ рд╣реИ, рдФрд░ рдЬреИрд╕реЗ рдХрд┐, рдЧреБрдВрдЬрд╛рдЗрд╢ рдЕрдкрд░рд┐рднрд╛рд╖рд┐рдд рд╣реИ ... рдлрд┐рд░ boundTranscludeFn , рдпрд╣ рдПрдХ рдирдпрд╛ рджрд╛рдпрд░рд╛ рдмрдирд╛рддрд╛ рд╣реИ рдпрджрд┐ transcludeScope рдЧрд▓рдд рд╣реИ ...

рдЗрд╕рд▓рд┐рдП, рдореИрдВ рдЬреЛ рдХрд╣ рд░рд╣рд╛ рд╣реВрдВ, 1 рдХреЗ рд▓рд┐рдП), рд╣рдо рдХреЗрд╡рд▓ рдЯреНрд░рд╛рдВрд╕рдХреНрд▓реВрдб рдлрдВрдХреНрд╢рди рдХреЗ рд▓рд┐рдП рдореМрдЬреВрджрд╛ рд╕реНрдХреЛрдк рдХреЛ рдирд┐рд░реНрджрд┐рд╖реНрдЯ рдХрд░ рд╕рдХрддреЗ рд╣реИрдВ (рдХреНрдпреЛрдВрдХрд┐ рдпрд╣ рдирд┐рд░реНрджреЗрд╢ рдХрд┐рд╕реА рднреА рдЪреАрдЬ рдХрд╛ рдкрдбрд╝реЛрд╕реА рдирд┐рд░реНрджреЗрд╢ рд╣реИ рдЬрд┐рд╕рдореЗрдВ рдЕрд▓рдЧ-рдЕрд▓рдЧ рдЧреБрдВрдЬрд╛рдЗрд╢ рд╣реЛ рд╕рдХрддреА рд╣реИ, рдпрд╣ рдЕрднреА рднреА рд╣рдореЗрдВ рдореВрд▓ рдЧреБрдВрдЬрд╛рдЗрд╢ рджреЗрдирд╛ рдЪрд╛рд╣рд┐рдП) ред

рд╡реИрдХрд▓реНрдкрд┐рдХ рд░реВрдк рд╕реЗ, 2), рдПрдХ рдирдпрд╛ рджрд╛рдпрд░рд╛ рдирд╣реАрдВ рдмрдирд╛рддреЗ рд╣реИрдВ рдФрд░ рдмрд╕ рд╡рд░реНрддрдорд╛рди рдЧреБрдВрдЬрд╛рдЗрд╢ (createBoundTranscludeFn рдореЗрдВ) рдбрд┐рдлрд╝реЙрд▓реНрдЯ рд░реВрдк рд╕реЗ (рд╕рдВрднрд╛рд╡рд┐рдд рд░реВрдк рд╕реЗ рдмреНрд░реЗрдХрд┐рдВрдЧ рдкрд░рд┐рд╡рд░реНрддрди, рдФрд░ рд╕рдВрднрд╛рд╡рд┐рдд рд░реВрдк рд╕реЗ рдмрд╣реБрдд рд╕рд╛рд░реЗ рдкрд░реАрдХреНрд╖рдг рддреЛрдбрд╝рддреЗ рд╣реИрдВ)ред

рджреЛрдиреЛрдВ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдмрд╣реБрдд рд╕рд░рд▓ рд╣реИрдВред

+1

+1

+1

рдирд┐рд╢реНрдЪрд┐рдд рд░реВрдк рд╕реЗ +1

+1

+1

+1

+1 рдХреГрдкрдпрд╛

рддреБрдореНрд╣реЗрдВ рдкрддрд╛ рд╣реИ рдХрд┐ рдХреНрдпрд╛ рдмрд╣реБрдд рдЕрдЪреНрдЫрд╛ рд╣реЛрдЧрд╛, рд╣рд╛рд▓рд╛рдВрдХрд┐ рд╢рд╛рдпрдж 1.3 рдХреЗ рд▓рд┐рдП рд╕рдордп рдореЗрдВ рдкреВрд░реА рддрд░рд╣ рд╕реЗ рд╕рдВрднрд╡ рдирд╣реАрдВ рд╣реИ, ES6 рдкрд░рджреЗ рдХреЗ рдкреАрдЫреЗ рдЯреНрд░рд╛рдВрд╕рдХреЙрдХреНрд╢рди рд╡рд╛рд╕реНрддрд╡ рдореЗрдВ рдЕрдЪреНрдЫрд╛ рдмрдирд╛ рд╕рдХрддрд╛ рд╣реИ --- рдЯреНрд░рд╛рдВрд╕рдХреЙрдХреНрд╢рди рдЧреБрдВрдЬрд╛рдЗрд╢ рдХреЗ рдЧреБрдгреЛрдВ рдХреЛ рдзреНрдпрд╛рди рдореЗрдВ рд░рдЦрддреЗ рд╣реБрдП, рд▓реЗрдХрд┐рди рдкрджрд╛рдиреБрдХреНрд░рдо рдореЗрдВ рд╕рд╣реА рд╕реНрдерд┐рддрд┐ рд╣реЛрдиреЗ рдкрд░ред

рдпрджрд┐ рдкреНрд░реЙрдХреНрд╕реА рдХрд╛рд░реНрдпрд╛рдиреНрд╡рдпрди рдЙрдкрд▓рдмреНрдз рдирд╣реАрдВ рд╣реИ, рддреЛ рд╕рдВрднрд╡рдд: рдмрд╕ рд╕реНрдХреЛрдк-рдмреИрдХ рдЯреВ рд╕реНрдХреЛрдк рд╣реЛ рд╕рдХрддрд╛ рд╣реИред рдореБрд╢реНрдХрд┐рд▓ рдмрд╛рдд рдпрд╣ рд╣реИ рдХрд┐ рдХрд▓реНрдкрдирд╛ рдереЛрдбрд╝реА рд▓рдбрд╝рдЦрдбрд╝рд╛рдИ рд╣реИред

рдпрджрд┐ рдЖрдк рдЧреБрдВрдЬрд╛рдЗрд╢ рдкрджрд╛рдиреБрдХреНрд░рдо рдмрд╣реБрдд рд╕рд╛рдл рд╣реЛрдирд╛ рдЪрд╛рд╣рддреЗ рд╣реИрдВ, рддреЛ рдЗрд╕рд▓рд┐рдП, рдЖрдк рдЕрднреА рднреА рдЕрд╡рд╛рдВрдЫрд┐рдд рд╕реНрдХреЛрдк рдкреНрд░рд╛рдкреНрдд рдХрд░реЗрдВрдЧреЗ, рд▓реЗрдХрд┐рди рдХрдо рд╕реЗ рдХрдо рдЖрдкрдХреЛ рдбреЗрдЯрд╛ рдмрд╛рдЗрдВрдбрд┐рдВрдЧ рдХрд╛ рд╕рд╛рдЗрдб рдЗрдлреЗрдХреНрдЯ рдЕрдкреНрд░рддреНрдпрд╛рд╢рд┐рдд рд░реВрдк рд╕реЗ рдирд╣реАрдВ рдЯреВрдЯреЗрдЧрд╛ред рдореБрдЭреЗ рдкрддрд╛ рдирд╣реАрдВред

+1

+1

+1

+1

+1

@ рдХрдЯрдкреБрдд

рдпрд╛, рдпрджрд┐ рдЖрдк рд╕реБрдкрд░ рдлреИрдВрд╕реА рд╣реЛрдирд╛ рдЪрд╛рд╣рддреЗ рдереЗ, рддреЛ рд╢рд╛рдпрдж рдЖрдк рдПрдирдЬреАрдЯреНрд░рд╛рдВрд╕рдХрд▓реНрдбреА рдХреЛ рдпрд╣ рдирд┐рд░реНрджрд┐рд╖реНрдЯ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдкреВрд░реА рддрд░рд╣ рд╕реЗ рдкрд░рд┐рд╡рд░реНрддрдиреЛрдВ рдХреЛ рддреЛрдбрд╝рдиреЗ рд╕реЗ рдмрдЪрд╛ рд╕рдХрддреЗ рдереЗ рдХрд┐ рдпрд╣ рд╡рд┐рд╢реЗрд╖рддрд╛ рдорд╛рди рдХреЗ рдорд╛рдзреНрдпрдо рд╕реЗ рдПрдХ рдирдпрд╛ рджрд╛рдпрд░рд╛ рдЪрд╛рд╣рддрд╛ рд╣реИ рдпрд╛ рдирд╣реАрдВред

рдЬреЛ рдХреБрдЫ рднреА рдкрд░рд┐рд╡рд░реНрддрди рдирд╣реАрдВ рд╣реЛрддрд╛ рд╣реИ рдЙрд╕реЗ рдореЗрд░рд╛ рд╡реЛрдЯ рдорд┐рд▓рддрд╛ рд╣реИред

+1

+1

+1

+1

+1

рд╕рдВрдмрдВрдзрд┐рдд: https://github.com/angular/angular.js/issues/7874

+1ред рдореИрдВ рд╣рдореЗрд╢рд╛ рдЗрд╕ рд╡реНрдпрд╡рд╣рд╛рд░ рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рд╕реЛрдЪрддрд╛ рдерд╛ред рдореБрдЭреЗ caitp рдХрд╛ рдпрд╣ рд╕рдорд╛рдзрд╛рди рдкрд╕рдВрдж рд╣реИ:

@ рдХрдЯрдкреБрдд

рдпрд╛, рдпрджрд┐ рдЖрдк рд╕реБрдкрд░ рдлреИрдВрд╕реА рд╣реЛрдирд╛ рдЪрд╛рд╣рддреЗ рдереЗ, рддреЛ рд╢рд╛рдпрдж рдЖрдк рд╡рд┐рд╢реЗрд╖рддрд╛ рдорд╛рди рдХреЗ рдорд╛рдзреНрдпрдо рд╕реЗ рдпрд╣ рдирд┐рд░реНрджрд┐рд╖реНрдЯ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдХрд┐ рдпрд╣ рдПрдХ рдирдпрд╛ рджрд╛рдпрд░рд╛ рдЪрд╛рд╣рддреЗ рд╣реИрдВ рдпрд╛ рдирд╣реАрдВ, рдпрд╣ рдирд┐рд░реНрджрд┐рд╖реНрдЯ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдПрдирдЬреАрдЯреНрд░рд╛рдВрд╕рдХреНрд▓рд╛рдЙрдб рдХреЛ рдкреВрд░реА рддрд░рд╣ рд╕реЗ рдмрджрд▓рдиреЗ рд╕реЗ рдмрдЪ рд╕рдХрддреЗ рд╣реИрдВред

+1

+1

+1

рдЗрд╕ рд╕рдорд╕реНрдпрд╛ рдХреЛ рджреЗрдЦрдиреЗ рд╡рд╛рд▓реЛрдВ рдХреЗ рд▓рд┐рдП, рдореИрдВрдиреЗ рдПрдХ 'рдмреЗрд╣рддрд░' рдПрдирдЬреА-рдЯреНрд░рд╛рдВрд╕рдХреНрд▓реВрдб рдбрд╛рдпрд░реЗрдХреНрдЯрд┐рд╡ рдмрдирд╛рдпрд╛ рд╣реИ, рдЬрд┐рд╕рдХрд╛ рдЧреБрдг рдорд╛рди рдЙрд╕рдХреЗ рдмрд╛рдж рдорд╛рдВрдЧреЗ рдЧрдП рдЖрдВрддрд░рд┐рдХ рджрд╛рдпрд░реЗ рдХреЛ рдкрд░рд┐рднрд╛рд╖рд┐рдд рдХрд░рддрд╛ рд╣реИ рдФрд░ 3 рдореЗрдВ рд╕реЗ рдПрдХ рд╣реЛ рд╕рдХрддрд╛ рд╣реИ:

  • рд╕рд┐рд▓реНрдЧрд┐рдВрдЧ -
  • рдкреИрд░реЗрдВрдЯ - рдЯреНрд░рд╛рдВрд╕рдХреЛрдб рдХреА рдЧрдИ рд╕рд╛рдордЧреНрд░реА рдХрд╛ рд╕реНрдХреЛрдк рдЙрд╕ рддрддреНрд╡ рдХрд╛ рд╣реИ рдЬрд╣рд╛рдВ рдЯреНрд░рд╛рдВрд╕рдХреЙрдХреНрд╢рди рд╣реЛрддрд╛ рд╣реИред
  • рдмрдЪреНрдЪрд╛ - рдЯреНрд░рд╛рдВрд╕рдХреЛрдб рдХреА рдЧрдИ рд╕рд╛рдордЧреНрд░реА рдХрд╛ рджрд╛рдпрд░рд╛ рдЙрд╕ рддрддреНрд╡ рдХреЗ рджрд╛рдпрд░реЗ рдХреЗ рд▓рд┐рдП рдЪрд╛рдЗрд▓реНрдб рд╕реНрдХреЛрдк рд╣реИ рдЬрд╣рд╛рдВ рдЯреНрд░рд╛рдВрд╕рдХреЙрдХреНрд╢рди рд╣реЛрддрд╛ рд╣реИред

рдЙрджрд╛рд╣рд░рдг рдЙрдкрдпреЛрдЧ:

template: 
  '<div ng-transclude="parent">' +
  '</div>'

рдкреВрд░реНрдг рдЙрджрд╛рд╣рд░рдг

рдЗрд╕ рдЙрджрд╛рд╣рд░рдг рдХреЛ рд╕рднреА рдХреЗ рдЙрджрд╛рд╣рд░рдг рдХреЗ рд▓рд┐рдП рджреЗрдЦреЗрдВред

рдЖрдЙрдЯрдкреБрдЯ рдРрд╕рд╛ рджрд┐рдЦрддрд╛ рд╣реИ:

image

рд╕реНрд░реЛрдд

.config(function($provide){
    $provide.decorator('ngTranscludeDirective', ['$delegate', function($delegate) {
        // Remove the original directive
        $delegate.shift();
        return $delegate;
    }]);
})

.directive( 'ngTransclude', function() {
  return {
    restrict: 'EAC',
    link: function( $scope, $element, $attrs, controller, $transclude ) {
      if (!$transclude) {
        throw minErr('ngTransclude')('orphan',
         'Illegal use of ngTransclude directive in the template! ' +
         'No parent directive that requires a transclusion found. ' +
         'Element: {0}',
         startingTag($element));
      }

      var iScopeType = $attrs['ngTransclude'] || 'sibling';

      switch ( iScopeType ) {
        case 'sibling':
          $transclude( function( clone ) {
            $element.empty();
            $element.append( clone );
          });
          break;
        case 'parent':
          $transclude( $scope, function( clone ) {
            $element.empty();
            $element.append( clone );
          });
          break;
        case 'child':
          var iChildScope = $scope.$new();
          $transclude( iChildScope, function( clone ) {
            $element.empty();
            $element.append( clone );
            $element.on( '$destroy', function() {
              iChildScope.$destroy();
            });            
          });
          break;
      }
    }
  }
})

рдЬреИрд╕рд╛ рдХрд┐ рдореИрдВрдиреЗ рдкрд╣рд▓реЗ # 8609 рдореЗрдВ рдЬреЛ рдореБрджреНрджрд╛ рдЙрдард╛рдпрд╛ рдерд╛, рдЙрд╕реЗ рдЗрд╕ рдзрд╛рдЧреЗ рдХреЗ рдбреБрдкреНрд▓рд┐рдХреЗрдЯ рдХреЗ рд░реВрдк рдореЗрдВ рдмрдВрдж рдХрд░ рджрд┐рдпрд╛ рдЧрдпрд╛ рдерд╛, рдореИрдВ рдЗрд╕реЗ рдпрд╣рд╛рдВ рдкреБрдирд░реНрд╕реНрдерд╛рдкрд┐рдд рдХрд░ рд░рд╣рд╛ рд╣реВрдВред

рдореЗрд░реА рд░рд╛рдп рдореЗрдВ DOM рдХреЗ рдкрд╛рд░рдЧрдорди рд╡рд╛рд▓реЗ рд╣рд┐рд╕реНрд╕реЗ рдХреЗ рд▓рд┐рдП рдПрдХ рдореМрдЬреВрджрд╛ рддрд░реАрдХрд╛ рдмрдирд╛рдпрд╛ рдЧрдпрд╛ рд╣реИ рдЬреЛ рдЕрддреНрдпрдзрд┐рдХ рдЕрддрд╛рд░реНрдХрд┐рдХ рд╣реИ!
рдпрд╣ рдХреЛрдгреАрдп рдореЗрдВ рд╕рд╛рдорд╛рдиреНрдп рдкреНрд░рд╡рд╛рд╣ рдХреЗ рдЦрд┐рд▓рд╛рдл рдЬрд╛рддрд╛ рд╣реИ, рдФрд░ рдЗрд╕реЗ рдареАрдХ рдХрд┐рдпрд╛ рдЬрд╛рдирд╛ рдЪрд╛рд╣рд┐рдП!

рдпрд╣рд╛рдБ рдореЗрд░реЗ рдкрд┐рдЫрд▓реЗ рдореБрджреНрджреЗ рдХрд╛ рдПрдХ рдЙрджреНрдзрд░рдг рд╣реИ:

рдореИрдВрдиреЗ рдпрд╣рд╛рдБ рдЕрдкрдиреЗ рдореБрджреНрджреЗ рдХреЛ рдЪрд┐рддреНрд░рд┐рдд рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдПрдХ рдЫреЛрдЯрд╛ рд╕рд╛ рдкреНрд▓рдВрдХ рдмрдирд╛рдпрд╛ред

рдореБрдЦреНрдп рдЕрдкрд░рд╛рдзреА рдЗрд╕ рдирд┐рд░реНрджреЗрд╢ рдореЗрдВ рд╣реИ

     function pane() {
        return {
           restrict: 'E',
           transclude: true,
           scope: {
              title: '@'
           },
           template: '<div style="border: 1px solid black;">' +
              '<div style="background-color: gray">{{title}} (isolate scope id: {{$id}})</div>' +
              '<ng-transclude></ng-transclude>' +
              '</div>'
        };
     }

рдЬрдм рдХреЛрдИ рдЙрдкрдпреЛрдЧрдХрд░реНрддрд╛ рдРрд╕рд╛ рдХреБрдЫ рдХрд░рддрд╛ рд╣реИ:

<form>
    <pane title='enter your name'>
         <input type='text ngModel='username'>
    </pane>
    <pane title='enter your token'>
         <input type='text ngModel='token'>
   </pane>


рдкрд░рд┐рдгрд╛рдо рдХрдИ, рд╡рд┐рд╢реЗрд╖ рд░реВрдк рд╕реЗ рдирдП рдЙрдкрдпреЛрдЧрдХрд░реНрддрд╛рдУрдВ рдХреЗ рд▓рд┐рдП рдЖрд╢реНрдЪрд░реНрдпрдЬрдирдХ рд╣реЛрдЧрд╛ред рдФрд░ рдпрд╣ рдПрдХ (рдЕрдзрд┐рдХ) рд╕рд░рд▓реАрдХреГрдд рдЙрдкрдпреЛрдЧ рдорд╛рдорд▓рд╛ рднреА рд╣реИред рд╡рд╣рд╛рдБ рдХреБрдЫ рд╕рддреНрдпрд╛рдкрди рд╕рдВрджреЗрд╢реЛрдВ рдХреЗ рдкреНрд░рджрд░реНрд╢рди рдореЗрдВ рдбрд╛рд▓рдиреЗ рдХрд╛ рдкреНрд░рдпрд╛рд╕ рдХрд░реЗрдВ;)

рдпрд╣ рдПрдХ рдЕрд▓рдЧ рдЙрдкрдпреЛрдЧ рдХрд╛ рдорд╛рдорд▓рд╛ рд╣реИ рдЬрд╣рд╛рдВ рдпрд╣ рдореБрджреНрджрд╛ рд╢реБрд░реВ рд╣реБрдЖ рдерд╛, рд▓реЗрдХрд┐рди рдореИрдВ рдорд╛рдирддрд╛ рд╣реВрдВ рдХрд┐ рдпрд╣ рдореВрд▓ рд░реВрдк рд╕реЗ рдПрдХ рд╣реА рдореБрджреНрджрд╛ рд╣реИ!

рдпрд╣ рдЗрд╕рдХреЗ рдмрдЬрд╛рдп рдбреЛрдо рддрддреНрд╡ рдХреЗ рд╕рд╛рде рдЧреБрдВрдЬрд╛рдЗрд╢ рдХреЛ рд╕реНрдерд╛рдирд╛рдВрддрд░рд┐рдд рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдФрд░ рдЕрдзрд┐рдХ рд╕рдордЭ рдореЗрдВ рдЖрддрд╛ рд╣реИред рдпрджрд┐ рд╡рд╛рд╕реНрддрд╡ рдореЗрдВ рдПрдХ рдирдП рджрд╛рдпрд░реЗ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рд╣реИ, рддреЛ рдЙрдкрдпреЛрдЧрдХрд░реНрддрд╛ ngController ngTransclude рддрддреНрд╡ рдкрд░ рдбрд╛рд▓ рд╕рдХрддрд╛ рд╣реИред рдпрд╛ ngTransclude рдкрд░ рдПрдХ рд╡реИрдХрд▓реНрдкрд┐рдХ рдЭрдВрдбрд╛ рд╣реЛ рд╕рдХрддрд╛ рд╣реИ рдЬреЛ рдПрдХ рдХреЛ рдЯреНрд░рд┐рдЧрд░ рдХрд░рддрд╛ рд╣реИред рдЙрд╕ рдЭрдВрдбреЗ рдХрд╛ рдЙрдкрдпреЛрдЧ # 5489 рдЙрдкрдпреЛрдЧ рдорд╛рдорд▓реЗ рдХреЛ рд╕реБрд▓рдЭрд╛рдиреЗ рдХреЗ рд▓рд┐рдП рднреА рдХрд┐рдпрд╛ рдЬрд╛ рд╕рдХрддрд╛ рд╣реИред рдФрд░ рдЗрд╕рдХрд╛ рдЙрдкрдпреЛрдЧ рд╕рдорд╛рдзрд╛рди рдХреЗрдЯ рдХреЗ рд▓рд┐рдП рднреА рдХрд┐рдпрд╛ рдЬрд╛ рд╕рдХрддрд╛ рд╣реИред

+1

+1

+1

+1

+1

+1

+1

+1

+1

+1

+1

+1

+1 рдРрд╕рд╛ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдРрд╕рд╛ рди рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдХрд╣рд╛ рдЬрд╛рдиреЗ рдкрд░ рднреА рдирд┐рд░реНрджреЗрд╢ рдХрд╛ рджрд╛рдпрд░рд╛ рдмрджрд▓ рдЬрд╛рддрд╛ рд╣реИред рдЙрджрд╛рд╣рд░рдг http://plnkr.co/edit/Wn81IBkE87vtigXvjmIa?p=preview

+1

+1

+1

+1

+1

+1

+1

+1

+ 1 тАФ рдХреНрдпрд╛ рдЗрд╕рдХреЗ рд▓рд┐рдП рдХреЛрдИ рдорд╛рдиреНрдп рд╡рд░реНрдХрдЕрд░рд╛рдЙрдВрдб рд╣реИрдВ?

@ рдорд┐рд▓реНрдХрд╡реЙрдиреНрдЧ , рдЗрд╕ рдзрд╛рдЧреЗ рдореЗрдВ рдПрдХ рдЬреЛрдбрд╝реА рд╡рд░реНрдХрдЕрд░рд╛рдЙрдВрдб рд╣реИрдВред рдореБрдЭреЗ рдкрддрд╛ рд╣реИ рдХрд┐ рдореИрдВрдиреЗ рдПрдХ рдкреНрд▓рдВрдХ рдореЗрдВ рд▓рд┐рдВрдХ рдХрд┐рдпрд╛ рдерд╛ рдЬрд┐рд╕рдореЗрдВ рд╡рд░реНрдХрдЕрд░рд╛рдЙрдВрдб рджрд┐рдЦрд╛рдпрд╛ рдЧрдпрд╛ рдерд╛ред

рдареАрдХ рд╣реИ, рдпрд╣рд╛рдВ рддрдХ тАЛтАЛрдХрд┐ рдЕрдЧрд░ рдпрд╣ рдЖрддрд╛ рд╣реИ рддреЛ рдпрд╣ 1.5.x рддрдХ рдирд╣реАрдВ рд╣реЛрдЧрд╛

рд▓реЗрдХрд┐рди рдЙрд╕рд╕реЗ рдкрд╣рд▓реЗ рдореБрдЭреЗ рдПрдХ рдЪрд┐рдВрддрд╛ рд╣реИред рдПрдХ рдирдпрд╛ рд╕реНрдХреЛрдк рдмрдирд╛рдиреЗ рдХрд╛ рдкреНрд░рд╛рдердорд┐рдХ рдХрд╛рд░рдг (рдЗрд╕реЗ рдЖрдЗрд╕реЛрд▓реЗрдЯреЗрдб рд╕реНрдХреЛрдк рдХрд╛ рдПрдХ рд╕рд┐рдмрд▓рд┐рдВрдЧ рдХрд╣реЗрдВ, рдпрд╛ рдЕрдзрд┐рдХ рд╕рдЯреАрдХ рд░реВрдк рд╕реЗ рдореВрд▓ рд╕реНрдХреЛрдк рдХрд╛ рдПрдХ рдмрдЪреНрдЪрд╛ рдЬрд╣рд╛рдВ рд╕реЗ рдЯреНрд░рд╛рдВрд╕рдХреЛрдб рдХреА рдЧрдИ рд╕рд╛рдордЧреНрд░реА рдЖрддреА рд╣реИ) рдореЗрдореЛрд░реА рд▓реАрдХ рдХреЛ рд░реЛрдХрдирд╛ рд╣реИред

рдЗрд╕ рдкреНрд▓рдВрдХрд░ рдХреА рддреБрд▓рдирд╛ рдХрд░реЗрдВ:
http://plnkr.co/edit/3NVxdYGy1AFDvD0M2BYI?==view

рдЙрд╕ рд╕рдВрд╕реНрдХрд░рдг рдХреЗ рд╕рд╛рде рдЬреЛ рдЙрд╕ рджрд╛рдпрд░реЗ рдХрд╛ рдкреБрди: рдЙрдкрдпреЛрдЧ рдХрд░рддрд╛ рд╣реИ рдЬрд╣рд╛рдВ рд╕реЗ рдореВрд▓ рд╕реНрдерд╛рдирд╛рдВрддрд░рдг рд╢рд╛рдорд┐рд▓ рд╣реИ:
http://plnkr.co/edit/MXFz2awcqwQQ7R882Xwz?==view

рджреВрд╕рд░реЗ рд╕рдВрд╕реНрдХрд░рдг рдореЗрдВ, рдЬреИрд╕реЗ рд╣реА рдЖрдк рджреЗрдЦрдиреЗ рд╡рд╛рд▓реЛрдВ рдХреА рд╕рдВрдЦреНрдпрд╛ рдХреЛ рдмрдВрдж рдХрд░ рджреЗрддреЗ рд╣реИрдВ, рдПрдХ рдореЗрдореЛрд░реА рд▓реАрдХ рд╣реЛ рдЬрд╛рддреА рд╣реИред

@petebacondarwin рдХреЛ рдирд┐рд╢реНрдЪрд┐рдд рд░реВрдк рд╕реЗ рдПрдХ рдирдпрд╛ рджрд╛рдпрд░рд╛ рд╣реЛрдирд╛ рдЪрд╛рд╣рд┐рдП рддрд╛рдХрд┐ рд╡рд╣ рдЕрдкрдиреЗ

рд╣рдордиреЗ рдлрд┐рд░ рд╕реЗ рд╕реЛрдЪрд╛ рдХрд┐ рдпрд╣ рдореБрджреНрджрд╛ рдХреЛрдгреАрдп 2 рддрд░рд╣ рд╕реЗ рдХрд╛рдо рдХрд░рдиреЗ рдХрд╛ рддрд░реАрдХрд╛ рд╣реИ, рдирд┐рд╢реНрдЪрд┐рдд рд░реВрдк рд╕реЗ рдПрдирдЬреА-рдЯреНрд░рд╛рдВрд╕рдХрд▓реНрдбреА рдПрдХ рдмрдЪреНрдЪреЗ рдХреЗ рджрд╛рдпрд░реЗ рдХрд╛ рдирд┐рд░реНрдорд╛рдг рдХрд░рддрд╛ рд╣реИ, рд▓реЗрдХрд┐рди рдРрд╕реЗ рд░рд╣рд╕реНрдпрдордп рдЕрд╡рд╕рд░ рд╣реЛрдВрдЧреЗ рдЬрд╣рд╛рдВ рдЖрдк рдЕрдкрдиреЗ рдЖрдк рдХреЛ рдЙрд╕реА рд╕реНрдерд┐рддрд┐ рдореЗрдВ рдкрд╛рдПрдВрдЧреЗ, рдЙрджрд╛рд╣рд░рдг рдХреЗ рд▓рд┐рдП рдПрдирдЬреА-рд░рд┐рдкреАрдЯ рдмрдЪреНрдЪреЗ рдХреЗ рджрд╛рдпрд░реЗ рдХреЛ рдмрдирд╛рддрд╛ рд╣реИред рдХреЛрдгреАрдп рдХреЛрдб рдХреЛ рджреЗрдЦрдиреЗ рдХреЗ рдмрд╛рдж, рд╣рдордиреЗ рдорд╣рд╕реВрд╕ рдХрд┐рдпрд╛ рдХрд┐ 2 рддрд░рд╣ рд╕реЗ рдмрд╛рдЗрдВрдбрд┐рдВрдЧ рд╕рдорд╕реНрдпрд╛ рдХреЗ рд╕рд╛рде рдореБрджреНрджрд╛ рдСрдмреНрдЬреЗрдХреНрдЯ рд╡рд┐рд╢реЗрд╖рддрд╛ рдХреЗ рд╕рд╛рде рд╕рдВрдкрддреНрддрд┐ рдХрд╛ рдХрд╛рдо рдирд╣реАрдВ рдХрд░рддрд╛ рд╣реИ, рд▓реЗрдХрд┐рди рд╡рд╕реНрддреБрдУрдВ рдХреЗ рд╕рд╛рде рдареАрдХ рдХрд╛рдо рдХрд░рддрд╛ рд╣реИ

рд╕рдорд╕реНрдпрд╛: http://plnkr.co/edit/Wn81IBkE87vtigXvjmIa?p=view

рд╣рд▓: http://plnkr.co/edit/KShClgQVwIjscXPzVRwR?f=view

рдпрд╣ рд╕рд╣реА рдирд╣реАрдВ рд╣реИ, рд▓реЗрдХрд┐рди рдпрд╣ рд╣рдорд╛рд░реЗ рдмрд╣реБрдд рд╕реЗ рдореБрджреНрджреЛрдВ рдХреЛ рд╣рд▓ рдХрд░рддрд╛ рд╣реИ, рдПрдХ рд╡рд┐рд╢реЗрд╖рддрд╛ рдкрд░ рджреЛ рддрд░рд╣ рд╕реЗ рдмрд╛рдзреНрдпрдХрд╛рд░реА рдХрднреА рдирд╣реАрдВ

рдзреНрдпрд╛рди рджреЗрдВ рдХрд┐ рдпрд╣ рд╕рдорд╛рдзрд╛рди рдкрд╣рд▓реЗ рд╕реЗ рд╣реА mbykovskyy рджреНрд╡рд╛рд░рд╛ рд╕реБрдЭрд╛рдпрд╛ рдЧрдпрд╛ рд╣реИ, рдЬрдм рдЙрдиреНрд╣реЛрдВрдиреЗ рдореБрджреНрджрд╛ рдЙрдард╛рдпрд╛, рдореИрдВ рд╕рд┐рд░реНрдл рдПрдХ рдЙрджрд╛рд╣рд░рдг рджреЗ рд░рд╣рд╛ рд╣реВрдВ рдХреНрдпреЛрдВрдХрд┐ рдореБрдЭреЗ рдпрд╣ рдкрддрд╛ рд▓рдЧрд╛рдиреЗ рдореЗрдВ рдереЛрдбрд╝реА рджреЗрд░ рд▓рдЧреАред

@petebacondarwin рдпрд╣ рдХреЗрд╡рд▓ рдПрдХ рдЕрд╕реНрдерд╛рдпреА рд░рд┐рд╕рд╛рд╡ рд╣реЛрдЧрд╛, рдЬрдм рддрдХ рдХрд┐ рд╣реЛрд▓реНрдбрд┐рдВрдЧ рд╕реНрдХреЛрдк рдирд╖реНрдЯ рдирд╣реАрдВ рд╣реЛрдЧрд╛ред рдпрд╣рд╛рдБ (рдПрдХ рдкреНрд▓рдВрдХ) [http://plnkr.co/edit/Q587WQnX0u0u7JjhtCxa?p=preview] рджрд┐рдЦрд╛рдпрд╛ рдЧрдпрд╛ рд╣реИ рдХрд┐ рдпрджрд┐ рдЖрдк рдЯреНрд░рд╛рдВрд╕рдХреНрд▓реВрдб-рд╣реЛрд▓реНрдбрд┐рдВрдЧ-рд╕реНрдХреЛрдк рдХреЛ рд╕реНрд╡рд┐рдЪ рдХрд░рддреЗ рд╣реИрдВ, рддреЛ рд╕рдмрдХреБрдЫ рдареАрдХ рд╣реЛ рдЬрд╛рдПрдЧрд╛ред
рдлрд┐рд░ рднреА рдпрд╣ рдПрдХ рдРрд╕рд╛ рдмрд┐рдВрджреБ рд╣реИ рдЬрд┐рд╕ рдкрд░ рдзреНрдпрд╛рди рджреЗрдиреЗ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рд╣реИред рд╢рд╛рдпрдж рдЗрд╕ рд╕рдВрднрд╡ рд░рд┐рд╕рд╛рд╡ рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рдбреЙрдХреНрд╕ рдореЗрдВ рдПрдХ рдмрдбрд╝реА рд╡рд╛рд░реНрдирд┐рдВрдЧ рдЗрд╕реЗ рдареАрдХ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдкрд░реНрдпрд╛рдкреНрдд рд╣реЛ рд╕рдХрддреА рд╣реИ?

рдЕрдЪреНрдЫреА рддрд░рд╣ рд╕реЗ рдХрд┐рд╕реА рднреА рдЬреЗрдПрд╕ рд░рд┐рд╕рд╛рд╡ рдХреЗрд╡рд▓ рдЕрд╕реНрдерд╛рдпреА рд╣реИ рдЬрдм рддрдХ рдЖрдк рдмреНрд░рд╛рдЙрдЬрд╝рд░ рдХреЛ рддрд╛рдЬрд╝рд╛ рдирд╣реАрдВ рдХрд░рддреЗ рд╣реИрдВ ;-)
8 рд╕рд┐рддрдВрдмрд░ 2015 16:41 рдкрд░, "рд╕реИрдВрдбрд░ рдПрд▓рд┐рдпрд╛рд╕" рд╕реВрдЪрдирд╛рдПрдВ @github.com рдиреЗ рд▓рд┐рдЦрд╛:

@petebacondarwin https://github.com/petebacondarwin рдпрд╣ рдХреЗрд╡рд▓ рдПрдХ рд╣реЛрдЧрд╛
рдЕрд╕реНрдерд╛рдпреА рд░рд┐рд╕рд╛рд╡, рдЬрдм рддрдХ рд╣реЛрд▓реНрдбрд┐рдВрдЧ рд╕реНрдХреЛрдк рдирд╖реНрдЯ рд╣реЛ рдЬрд╛рдПрдЧрд╛ред рдпрд╣рд╛рдВ рд╣реИ
рдкреНрд▓рдВрдХ) [http://plnkr.co/edit/Q587WQnX0u0u7JjhtCxa?p=preview] рдЬреЛ рджрд┐рдЦрд╛рддрд╛ рд╣реИ
рдХрд┐ рдЕрдЧрд░ рдЖрдк рдЯреНрд░рд╛рдВрд╕рдХреНрд▓реВрдб-рд╣реЛрд▓реНрдбрд┐рдВрдЧ-рд╕реНрдХреЛрдк рдХреЛ рд╕реНрд╡рд┐рдЪ рдХрд░рддреЗ рд╣реИрдВ, рддреЛ рд╕рдмрдХреБрдЫ рдорд┐рд▓ рдЬрд╛рдПрдЧрд╛
рдмрд╕ рдареАрдХ рдЬрд╛рд░реАред
рдлрд┐рд░ рднреА рдпрд╣ рдПрдХ рдРрд╕рд╛ рдмрд┐рдВрджреБ рд╣реИ рдЬрд┐рд╕ рдкрд░ рдзреНрдпрд╛рди рджреЗрдиреЗ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рд╣реИред рд╢рд╛рдпрдж рдПрдХ рдмрдбрд╝реА рд╡рд╛рд░рд┐рдВрдЧ рдореЗрдВ
рдЗрд╕ рд╕рдВрднрд╡ рд░рд┐рд╕рд╛рд╡ рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рдбреЙрдХреНрд╕ рдЗрд╕реЗ рдареАрдХ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдкрд░реНрдпрд╛рдкреНрдд рд╣реЛ рд╕рдХрддреЗ рд╣реИрдВ?

-
рдЗрд╕ рдИрдореЗрд▓ рдХрд╛ рдЙрддреНрддрд░ рд╕реАрдзреЗ рджреЗрдВ рдпрд╛ рдЗрд╕реЗ GitHub рдкрд░ рджреЗрдЦреЗрдВ
https://github.com/angular/angular.js/issues/5489#issuecomment -138603298
ред

@SanderElias рд╣рдорд╛рд░реЗ рдХреЛрдгреАрдп рдЕрдиреБрдкреНрд░рдпреЛрдЧ рдХреЗ рдЙрдкрдпреЛрдЧрдХрд░реНрддрд╛ рджрд┐рди рдХреЗ рдЕрдВрдд рд╕реЗ рд╢реБрд░реВ рд╣реЛрдиреЗ рддрдХ рд╡реНрдпрд╕реНрдд рд╣реИрдВред
рд╣рдо рдкрд╣рд▓реЗ рд╕реЗ рд╣реА рджреЗрдЦрддреЗ рд╣реИрдВ рдХрд┐ рджрд┐рди рдХреЗ рджреМрд░рд╛рди рдореЗрдореЛрд░реА рдХрд╛ рдЙрдкрдпреЛрдЧ рдмрдврд╝ рд░рд╣рд╛ рд╣реИ рдФрд░ рдкреЗрдЬ рдкрд░ рд╣рдо рдЬреЛ рднреА рдбрд╛рд▓рддреЗ рд╣реИрдВ рдЙрд╕рдореЗрдВ рд╣рдореЗрдВ рдмрд╣реБрдд рд╕рд╛рд╡рдзрд╛рди рд░рд╣рдирд╛ рдЪрд╛рд╣рд┐рдП, рдЕрдзрд┐рдХ рд╕рдВрднрд╛рд╡рд┐рдд рд▓реАрдХ рдХрд╛ рдкрд░рд┐рдЪрдп рджреЗрдирд╛ рдЬреЛрдЦрд┐рдо рднрд░рд╛ рд╣реИред

@troch -

рдореБрдЭреЗ @petebacondarwin рд╕реЗ рд╕рд╣рдордд

рдЕрдЪреНрдЫреА рдмрд╛рдд рд╣реИ рдХрд┐ рдореИрдВ рд╕рд╛рд▓реЛрдВ рдкрд╣рд▓реЗ рдПрдореНрдмрд░ рдореЗрдВ рдмрджрд▓ рдЧрдпрд╛ред :)

рдХреНрдпрд╛ рдпрд╣ рдкреГрд╖реНрда рдЙрдкрдпреЛрдЧреА рдерд╛?
0 / 5 - 0 рд░реЗрдЯрд┐рдВрдЧреНрд╕

рд╕рдВрдмрдВрдзрд┐рдд рдореБрджреНрджреЛрдВ

tdumitrescu picture tdumitrescu  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

jpsimons picture jpsimons  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

piu picture piu  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

jtorbicki picture jtorbicki  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

cmplank picture cmplank  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ