javascript - 当与角js一起使用时，Javascript无法正常工作

我正在使用 MEAN堆栈进行开发。

我有3个下拉列表，让我们说下拉列表1 ，下拉列表2 ，下拉列表3 。
当我从下拉列表1 中选择 option 时， droppdown 2将填充选项。
当我从下拉列表2 中选择一个选项时，下拉列表3 将填充选项。

为了达到这个目的，我使用了javascript，它将根据用户的选择动态填充下拉列表

现在，在jsfiddle上运行我的脚本时，一切都运行顺畅，但是当我在前端页面中添加相同的代码时，所有下拉列表都没有显示任何选项。

有关代码，请参阅：jsfiddle

为什么会这样？