Question

对于这个简单的问题真的很抱歉，但由于某种原因，我无法在网站上工作这么简单。我不认为我完全理解如何将控制器分配给html块。这就是我所拥有的

的index.html：

<!DOCTYPE html>
<html >

<head>
    <meta charset="utf-8">
    <title>Welcome to Firebase Hosting</title>
    <style media="screen">
        body {
            font-family: Roboto, Arial, sans-serif;
            background: #ECEFF1;
            color: rgba(0, 0, 0, 0.87);
        }

        a {
            color: rgb(3, 155, 229);
        }

        #message {
            max-width: 400px;
            margin: 40px auto;
            box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 2px 1px -1px rgba(0, 0, 0, 0.12);
            border-radius: 2px;
            background: white;
            padding: 16px 24px;
        }

        #message h1 {
            font-size: 22px;
            font-weight: 500;
            text-align: center;
            margin: 0 0 16px;
        }

        #message p {
            font-weight: 300;
            line-height: 150%;
        }

        #message ul {
            list-style: none;
            margin: 16px 0 0;
            padding: 0;
            text-align: center;
        }

        #message li a {
            display: inline-block;
            padding: 8px;
            text-transform: uppercase;
            text-decoration: none;
            font-weight: 500;
            background: rgb(3, 155, 229);
            color: white;
            border: 1px solid rgb(3, 155, 229);
            border-radius: 3px;
            font-size: 14px;
            box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .26);
        }
    </style>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js"></script>
</head>

<body ng-app="portfolio">
    <div id="message" ng-controller="portCtrl">
        <div ng-show="main">Main</div>
        <div ng-show="resume">Resume</div>
    </div>
</body>

</html>

app.js：

angular.module('portfolio', []).controller('portCtrl', ['$scope', function($scope){
    $scope.main = true;
    $scope.resume = false;
}]);

对于控制器，我使用的是我在W3学校发现的更强的声明，但是我遇到了同样的问题而没有使用额外的['$ scope']包装器。

我希望显示单词Main以及隐藏单词Resume，但是它们都会显示。

Answer 1

您是否包含了jQuery脚本参考？如果你没有包含它，只需从cdn中找到jQuery版本1.10参考链接或自己下载文件。然后设置参考链接如下：

jQuery脚本
angularjs script
您的脚本文件也应包含在angularjs下面

如果你做了所有这些，请告诉我，以便我可以帮助你解决其他事情。

Answer 2

试试这个

union

使用布尔值使ngShow工作

2 个答案: