Question

首先看一下小代码片段。我们可以根据需要在一个页面中渲染多个视图页面。这里有一个div（id = d1）。当在ajax调用之后单击Button（1）时，它再添加一个按钮（2）和另一个div（id = 2）。单击button2时，将在下一个视图中设置动态内容，并在单个页面中显示两个视图。为此，我们可以使用.html（）和div的id。

但我想用AngularJs来实现它。因为在AngularJs只有一个视图，所以我很困惑在哪里以及如何在同一页面中获得两个视图。

<html>
    <head>
        <script src="js/jquery.js"></script>
    </head>
    <body>
        <input type="button" id="b1" value="Button1"> 

        <div id="d1"></div>

        <script>
            $(document).ready(function(){
                $("#b1").on("click",function(){
                    ajaxFunc("url1",{data},function(){
                        $("#d1").html('<input type="button" id="b2" value="Button2"><div id="d2"></div>');
                    });
                });

                $("#b2").on("click",function(){
                    ajaxFunc("url2",{data},function(){
                        $("#d2").html('This is div');
                    });
                });
            });

            function ajaxFunc(url,data,callback){
                $.ajax({
                    url:url,
                    data:data,
                    success:function(resp){
                        if(callback){
                            callback();
                        }
                    }
                })
            }
        </script>
    </body>
</html>

如何使用angularjs在单个页面中渲染多个视图页面

0 个答案: