美文网首页
$window, $document

$window, $document

作者: binyu1231 | 来源:发表于2015-08-14 23:54 被阅读105次

    $window

    • ng模块中的服务

    这是一个浏览器端 window 对象的引用. 由于Javascript 中的window是一个全局变量,它会给可测试性带来问题。在Angular中我们总会通过 $window 服务来引用它,因此在测试总它可以被改写、删除或模拟。

    在下面的例子中,表达式可以像定义一个ngClick指令一样,在当前作用域被严格的评估。因此, 在这种依赖于一个全局变量表达式中,不会因为不经意的编码而带来风险。


    例子

    html and javascript

    <script>
      angular.module('windowExample', [])
    
        .controller('ExampleController', ['$scope', '$window', function($scope, $window) {
          $scope.greeting = 'Hello, World!';
          $scope.doGreeting = function(greeting) {
            $window.alert(greeting);
          };
        }]);
    </script>
    <div ng-controller="ExampleController">
      <input type="text" ng-model="greeting" aria-label="greeting" />
      <button ng-click="doGreeting(greeting)">ALERT</button>
    </div>
    

    protractor

    it('should display the greeting in the input box', function() {
    
     element(by.model('greeting')).sendKeys('Hello, E2E Tests');
     // If we click the button it will block the test runner
     // element(':button').click();
    });
    

    $document

    • ng模块中的服务

    一个对于浏览器中的 window.document对象的jQuery 或 jqLite 封装。


    依赖

    $window


    例子

    html

    <div ng-controller="ExampleController">
    
      <p>$document title: <b ng-bind="title"></b></p>
      <p>window.document title: <b ng-bind="windowTitle"></b></p>
    
    </div>
    

    javascript

    angular.module('documentExample', [])
    
    .controller('ExampleController', ['$scope', '$document', 
      function($scope, $document) {
    
        $scope.title = $document[0].title;
        $scope.windowTitle = angular.element(window.document)[0].title;
    
    }]);
    

    相关文章

      网友评论

          本文标题:$window, $document

          本文链接:https://www.haomeiwen.com/subject/umpiqttx.html