AngularJs视图和DOM（传单和ag网格）

我有一个AngualrJS应用程序，目前是单页。它将使用布尔值上的ng show/hide显示传单地图或两个Ag栅格，一次仅显示地图或栅格

我在想，最好使用ui路由器添加路由，并有两个视图，一个用于传单地图，另一个用于两个ag网格

我在网格方面遇到了一些问题，可能是因为有必要做一些类似的事情

// wait for the document to be loaded, otherwise
// ag-Grid will not find the div in the document.
document.addEventListener("DOMContentLoaded", function() {
    // lookup the container we want the Grid to use
    var eGridDiv = document.querySelector('#myGrid');

    // create the grid passing in the div to use together with the columns & data we want to use
    new agGrid.Grid(eGridDiv, gridOptions);

我不是要解决我的编码问题，我希望自己能解决这个问题

相反，我请求您帮助我理解AngularJs ui路由器视图是如何工作的

它们是否总是绑定到DOM，并在输入适当的状态之前隐藏，还是随着状态的更改而添加到DOM或从DOM中删除

---

为了理解引擎盖下的工作原理，我还需要知道什么吗？

如果我正确理解了要求，您可以先定义一些条件，然后转换到适当的视图

在示例代码中，可以更改输入的“选中”属性以更改显示的视图

var myApp=angular.module'helloworld'，['ui.router'] .configfunction$stateProvider{ 变量helloState={ 姓名：'你好'， url:“/你好”， 模板：“你好，世界！” } var aboutState={ 姓名：'关于'， url:“/关于”， 模板：“这是UI路由器hello world应用程序！” } $stateProvider.statehelloState； $stateProvider.stateaboutState； } .指令'selectView'，selectView； 让国家； 让过渡； 功能选择查看$state，$transitions{ state=$state； 转换=$transitions； 返回{ 限制：“A”， 链接：选择ViewLinkfn } } 函数selectViewLinkFn$scope$element{ const triggers=document.queryselectoral'input[type=radio]； transitions.onSuccess{}，=>{ console.log“onSuccess:”，document.querySelector“h3”。innerHTML； }; transitions.onStart{}，=>{ const findedInView=document.querySelector'h3'； console.log`onStart:${findedInView？findedInView.innerHTML:'nothing found'}`； }; setView$scope； 触发器的常量触发器{ trigger.addEventListener'change'，=>setView$scope，true } 函数setViewscope，needDigest{ //检查一些条件 让我们走这条路； 用于触发器的常量触发器{ 如果触发器被选中{ currentRoute=trigger.value； } } state.gocurrentRoute； 如有需要，请参阅摘要{ 范围。$摘要； } } } 选择视图。$inject=['$state'，'$TRANSTIONS']； 你好 关于

---

这在本地主机上适用吗？当我运行代码段时，当我选择其单选按钮时，“关于”视图不会显示。您需要添加事件侦听器。然后运行状态，进入状态。如果您添加了带有本机javascript的侦听器，则必须为应用更改执行$scope.digest。不过，我不确定您是否真的在回答我的问题。您正在对始终存在而不是在视图中的DOM元素调用document.querySelector。我想了解如何&当视图元素添加到DOMI think中时，您可以使用transitions挂钩来探索这个问题。我更改了示例代码，以演示可用选项感谢1000000。这给了我实现我想要的东西所需要的一切。