1

我对 Angularjs 完全陌生，并且已经很久没有编写任何代码了。我开始使用 Angularjs 再次设置我的网站。我有一个主页和一个关于页面，用户通过 ngRoute 在 ng-click（或点击空格）上获得。一旦进入关于页面，用户可以通过单击页面上的某处等来返回。

应用程序.js

   var app = angular.module("MyApp", ["ngRoute"]);
   app.config(function($locationProvider, $routeProvider) {
       $routeProvider
       .when("/teaser", {
           controller:"teaserCtrl",
           templateUrl:'teaser.html'
       })
       .when("/about", {
           controller:"aboutCtrl",
           templateUrl: "about.html"
       })
       .otherwise({
           redirectTo:"/teaser"
       })
    });

    app.controller("mainCtrl", function($scope, $http, $location) {
        $scope.v = {
            inverted: false,
            display: true,
            offwhite: true,
        }

        $scope.$on("space", function() {
            if ($scope.v.teaser) {
                $location.path("/about")
                $scope.v.teaser = false
            } else {
                $location.path("/teaser")
                $scope.v.teaser = true
            } 
            $scope.$apply()
        })

        $scope.goHome = function(){
            $scope.$broadcast("goHome")
        }
    });

    app.directive("ngMobileClick", [function () {
        return function (scope, clickElement, attrs) {
            clickElement.bind("touchstart click", function (e) {
                e.preventDefault();
                e.stopPropagation();

                scope.$apply(attrs["ngMobileClick"]);
            });
        }
    }])

HTML

    <body ng-controller="mainCtrl as main" ng-mobile-click="goHome()" ng-class="{inverted: v.inverted, bg: v.offwhite}" space>
        <div class="content" ng-view ng-hide="v.display"></div>
    //My body code

        <script ng-init="sw = 'some website'; id="about.html" type="text/ng-template">
            <div class="about">
                <p class="text" ng-click="next(); $event.stopPropagation()">
                <p>some text</p>
                <br>
                <a ng-href="{{mail}}" ng-click="$event.stopPropagation()">some address</a>
                </p>
            </div>
        </script>
    </body>

about 页面的代码被写入脚本，并且具有超链接 (ng-href)。现在我的问题：如您所见，我将主体部分的 ng-click 更改为 ng-mobile-click。如果我还在脚本中为超链接更改它，则会发生一些我无法真正弄清楚的奇怪事情（链接更改为悬停颜色，但仍然没有重定向到 ng-href。

对于桌面版，点击触发ngRoute，但我也可以点击链接。对于移动版本，这不再可能。有什么想法可以解决这个问题吗？我知道，不可能悬停，但不知何故，我还需要在移动设备上检测超链接，而无需重定向到主页。

正如我所说：这是我第一次尝试使用 Angularjs，我有一段时间没有编写任何代码，请尽可能清楚！

还有另一个我没有放在这里的 Teaser/about 控制器，以及 keyup 的指令。

有什么想法或建议吗？非常感谢您！

4

0 回答 0