Angularjs - Controller-Vererbung Vs Scope-Vererbung

Question

Mar 18, 2016, 12:30 PM

Angularjs - Controller-Vererbung Vs Scope-Vererbung

Below ist der Code, der die Bereichsvererbung verwendet.

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title> Controller inheritance</title>
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.min.js"></script>
        <script type="text/javascript">
            var sample = angular.module("sample", []);

            function ParentController(){
                this.Name = "Jag";
            }

            sample.controller("emp", ParentController);

            function ChildController(){
                this.Sal = 3500;
                this.Dept = "Sales";
            }

            sample.controller("empDetails", ChildController);
        </script>
    </head>s
    <body ng-app="sample">
        <div ng-controller="emp as o1">
            Employee details of <strong>{{o1.Name}}</strong>:
            <div ng-controller="empDetails as o2">
                <strong>{{o1.Name}}</strong> earns {{o2.Sal}} and works in {{o2.Dept}} department.
            </div>  
        </div>

    </body>
</html>

where verschachtelter Bereich der Controller-Instanzo2 muss auf @ verweisName wieo1.Name.

Below ist der Code für die Controller-Vererbung,

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title> Scope inheritance</title>
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.min.js"></script>
        <script type="text/javascript">
            var sample = angular.module("sample", []);

            function ParentController(){
                this.Name = "Jag";
            }
            sample.controller("emp", ParentController);

            function ChildController(){
                ParentController.call(this);
                this.Sal = 3500;
                this.Dept = "Sales";
            }
            ChildController.prototype = Object.create(ParentController.prototype);
            sample.controller("empDetails", ChildController);
        </script>
    </head>
    <body ng-app="sample">
        <div ng-controller="emp as o1">
            Employee details of <strong>{{o1.Name}}</strong>:
        </div>
        <div ng-controller="empDetails as o2">
                <strong>{{o2.Name}}</strong> earns {{o2.Sal}} and works in {{o2.Dept}} department.
        </div>

    </body>
</html>

o Umfang vono2 ist nicht verschachtelt.

Um die Vererbungshierarchie zu entwerfen, welchen Ansatz empfiehlt AngularJS?

Hinweis: TerminologieController-Vererbung ist kein Standardbegriff.