Question

我正在努力学习Angular js。我想嵌入另一个网站as a part of my webpage;在“div”内。到目前为止，我有以下代码，这对我来说就是这样。

但是，嵌入式网站中会有超链接。当有人点击超链接时，是否有一种方法可以在同一div内显示新内容？

有可能吗？

<body ng-app="sampleApp">
    <div ng-controller="CommonController">
        <div>
            <a href="#" ng-click="show()">ShowPage</a>
        </div>
            <div ng-bind-html-unsafe="expression"/>
    </div>
    <script
        src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
    <script>
        var sampleApp = angular.module('sampleApp', []);
        sampleApp
                .controller(
                        'CommonController',
                        function($scope, $http) {
                            $scope.show = function() {
                                var responsePromise = $http
                                        .get("http://localhost:8080/HelpDynamic/spring/welcome");
                                responsePromise.success(function(data, status,
                                        headers, config) {
                                    $scope.expression = data;
                                });
                                responsePromise.error(function(data, status,
                                        headers, config) {
                                    alert("AJAX failed!");
                                });
                            }
                        });
    </script>
</body>

Answer 1

最简单的方法是使用ui-router代替ng-router。此社区构建模块允许您使用嵌套视图。这意味着您可以将其他模板集成到您使用的模板中。

要了解如何操作，我建议您阅读有关嵌套视图的精心编写的指南：https://github.com/angular-ui/ui-router/wiki/Nested-States-%26-Nested-Views。

Angular JS将html页面嵌入为窗口小部件

1 个答案: