Ng-повторить закомментировано в шаблоне Jade - PullRequest
0 голосов
/ 12 июня 2019

Я работаю над ранее созданным сайтом и пытаюсь добавить угловой в шаблон Jade.Я пытаюсь использовать простой ng-repeat, но он продолжает комментироваться.Я полагаю, что это как-то связано с порядком загрузки, как в шаблоне, но я не могу найти ничего хорошего.У кого-нибудь есть идеи?

bundles.jade

extends global_layout

block content
    script(src='/javascripts/ui-bootstrap-tpls-2.5.0.min.js')
    script(src='/javascripts/sliderApp.js')

style
    // CSS

    div(ng-app='sliderApp')
        div(ng-controller='sliderCtrl')
            div.slide(style='padding-top:3vh;')
                div.banner-titan.Grid.-left#banner1
                    div.Cell.-1of12
                    div.Cell.-6of12
                        h1(style='padding-left:16.666667%;') Find the best bundle for your patient
                        div(style='text-align:right; margin-top:12.5em;')
                            // input.btn.btn-link(style='text-decoration:underline;', value='See all bundles >>>')
                    div.Cell.-1of12
                    div.Cell.-2of12(style='padding-top:8.33em; text-align:center;')
                        div(uib-carousel, active='active', interval='5000', style='height:45vh; width:min-content; margin-bottom:8.33em;')
                            div(uib-slide, ng-repeat='image in product_image_list track by $index', index='$index')
                                img(src='/images/bundles/{{image.img_src}}', style='max-height:45vh;')
                                div.carousel-caption
                                    p test
                        input.btn-big.btn-primary.btn-cornered(type='button', value='Get Started', ng-click='')
            div.slide
                div.banner-prussian.Grid.-center#banner2(style='position:relative;')
                div.Cell.-10of12.question(id='{{slide.tile}}', style='absolute;', ng-repeat='slide in questionUrls track by $index')
                    div(style='width:100%; margin-top:4.1666667em; border-bottom:2px solid white; text-align:center; vertical-align:middle;')
                        h2(style='color:white; font-style:italic;') {{1 + displayedSlides.indexOf(slide.tile)}} <span style='font-family:neutratext-light !important;'>of</span>  {{displayedSlides.length}}
                        div(ng-include='slide.url')

slidderApp.js

var app = angular.module('myApp', ['ngAnimate', 'ui.bootstrap']);

app.controller('sliderCtrl', function ($scope, $location, $anchorScroll, $http) {
    // Other stuff

    $scope.product_images_list = [
        { name: "Corpus Ergo Backrest", img_src: "Corpus Back & Seat Cushion.jpg" },
        { name: "Permobil F3 Power Wheelchair", img_src: "F3.png" },
        { name: "ROHO Quadtro Select High Profile Seat Cushion", img_src: "ROHO Quadtro Select_HP.jpg" },
        { name: "ROHO Agility Max Contour Backrest", img_src: "AG6 Back Angled QR LG.jpg" },
        { name: "Comfort M2 Seat Cushion", img_src: "M2 Zero 1115.jpg" },
        { name: "ROHO Hybrid Elite Seat Cushion", img_src: "Hybrid Elite Dual Valve_No Bkgrd_No Cov.jpg" },
        { name: "Corpus Ergo Seat cushion", img_src: "Corpus Back & Seat Cushion.jpg" },
        { name: "Permobil M3 Power Wheelchair", img_src: "M3.png" },
        { name: "Permobil F5 VS Power Wheelchair", img_src: "F5VS.png" },
        { name: "Permobil M1 Power Wheelchair", img_src: "M1.png" },
        { name: "ROHO Agility Min Countour Backrest W/Air and Lumbar", img_src: "AG2 Back Angled LG.jpg" },
        { name: "Aero X", img_src: "Aero X.jpg" },
        { name: "Aero Z", img_src: "Aero Z.jpg" },
        { name: "Aero T", img_src: "Aero T.jpg" }

    ];
});

Вывод с консоли разработчика

<!-- ngRepeat: image in product_image_list track by $index -->

1 Ответ

2 голосов
/ 12 июня 2019

Элемент div комментируется, когда объект пуст или недоступен или не определен.

В вашем случае, в контроллере вы использовали имя объекта как «product_images_list», а в ng-repeat вы используете «product_image_list»

Итак, здесь вы ошиблись объектом, и поэтому егополучить комментарий.

Все, что вам нужно сделать, это изменить имя объекта в ng-repeat на 'product_images_list'.

Надеюсь, это решит вашу проблему.

...