ホームページ > ウェブフロントエンド > jsチュートリアル > Angular でローカル情報を取得するための組み込みサービスを取得する方法

Angular でローカル情報を取得するための組み込みサービスを取得する方法

一个新手
リリース: 2017-10-14 09:10:38
オリジナル
1687 人が閲覧しました

以前は angular を使用してタイマーを設定しました。今日はタイマーに基づいていくつかの演習を行います。

組み込みサービスを使用して次の情報を取得します:

1. 画面の高さを取得します

2. 画面の幅を取得します

3.ページを取得しますタイトル

4.URLプロトコルを取得

5.URLホストを取得

6.ポート番号を取得

7.

URLを取得ハッシュパート 8.

アクセスアドレス、つまり

URLアドレスを取得します

その他の要件:

1. 2以降は高さと幅が表示されますページを開いてから数秒

2 ページを開いてから 3 秒後に .ti​​tle、プロトコル、ホストが表示されます

3. ページを開いてから 5 秒後に、プロンプトボックスが表示されます。 「はい」をクリックすると表示されます。

<!DOCTYPE html><html><head>
    <meta charset="UTF-8">
    <script type="text/javascript" src="angular-1.3.0.js"></script>
    <title>day12日考</title></head><body ng-app="myApp"><p ng-controller="myCtrl">
    <p>屏幕有效的宽度(单位:像素):{{ width }}</p>
    <p>屏幕有效的高度(单位:像素):{{ height }}</p>
    <p>页面title:{{ title }}</p>
    <p>URL主机:{{ host }}</p>
    <p>URL协议:{{ protocol }}</p>
    <p>端口:{{ port }}</p>
    <p>URL的hash部分:{{ hash }}</p>
    <p>URL地址:{{ href }}</p></p><script>
    var nowtime = function () {        return new Date().toLocaleDateString() + " " + new Date().toLocaleTimeString();
    };    var app = angular.module("myApp", []);    app.controller("myCtrl", function ($scope, $interval, $timeout) {
        $interval(function () {
            $scope.width = screen.availWidth;
            $scope.height = screen.availHeight;
        }, 2000);

        $timeout(function () {
            $scope.title = document.title;
            $scope.host = location.host;
            $scope.protocol = location.protocol;
        }, 3000);

        $timeout(function () {            var msg = "是否显示?";            if (confirm(msg)==true){
                $scope.port = window.location.port;
                $scope.hash = location.hash;
                $scope.href = window.location.href;
            }else{                alert("你选择了不展示");
            }
        }, 5000);
    });</script></body></html>
ログイン後にコピー

以上がAngular でローカル情報を取得するための組み込みサービスを取得する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート