#javascript #polymer #polymer-1.0 #shadow-dom #custom-element
#javascript #полимер #polymer-1.0 #shadow-dom #пользовательский элемент
Вопрос:
РЕШАЕМАЯ
Я взял ответ, который @akc42 опубликовал ниже, и добавил var self = this;
перед getViews
определением функции и изменил this
на self
in code (и добавил self
к ytr
тому 100 / self.ytr
же)
/ РЕШАЕМАЯ
Я пытаюсь получить количество просмотров на своем канале YouTube. Все, что я хочу сделать, это вернуть вычисленные результаты обратно в <p id="views"></p>
и <p id="youtubeRequest"></p>
.
У меня есть этот код:
<template>
...
<div>
<p id="views" style="display:inline; ">100/Amount of views:</p>
<p id="youtubeRequest" style="display:inline">Amount of views:</p>
</div>
...
</template>
<script>
Polymer({
is: 'my-view1',
ready: function()
{
function getViews(params) {
$.ajax({
url: "https://www.googleapis.com/youtube/v3/channels?part=statisticsamp;key=MyAPIkeyHere",
jsonp: "callback",
dataType: "jsonp",
success: function(response) {
this.ytr = this.$.youtubeRequest.innerHTML = response.items[0].statistics.viewCount;
var ytr2 = this.$.views.innerHTML = 100 / ytr;
this.ytr3 = ytr2.toPrecision(1);
},
});
}
getViews()
}
</script>
</dom-module>
Я использую this.$.id
вместо document.getElementById("youtubeRequest")
, поскольку он используется только для доступа к элементам за пределами элемента Polymer .
Мне нужно привязать вычисленные значения к соответствующим <p>
тегам
Комментарии:
1.
response.items
должен вернутьсяundefined
.2. Но что это значит? Я новичок в веб-разработке, и я не уверен, что с этим делать
3. Каков ответ, консоль. запишите это или что-то в этом роде
4. Это означает, что он не существует
5. @Un1 если вы попытаетесь получить значение, которого не существует, вы получите
undefined
. Вот и все.
Ответ №1:
Ваш приведенный выше код показывает закрытие </dom-module>
, но не начало. Вы пытаетесь определить элемент Polymer.
Если это так, вы просто используете привязку данных. Вы также можете использовать для выполнения вызова ajax, но давайте сначала поработаем с другим битом. Что-то вроде этого
<dom-module id="my-view1">
<template>
...
<div>
<p id="views" style="display:inline; ">Amount of views: [[ytr]]</p>
<p id="youtubeRequest" style="display:inline">[[ytr3]]</p>
</div>
...
</template>
<script>
Polymer({
is: 'my-view1',
properties: {
ytr: {
type: Number,
value: 0
},
ytr3: {
type: Number,
value: 0
}
},
ready: function()
{
function getViews(params) {
$.ajax({
url: "https://www.googleapis.com/youtube/v3/channels?part=statisticsamp;key=MyAPIkeyHere",
jsonp: "callback",
dataType: "jsonp",
success: function(response) {
this. ytr = this.$.youtubeRequest.innerHTML = response.items[0].statistics.viewCount;
var ytr2 = this.$.views.innerHTML = 100 / ytr;
this.ytr3 = ytr2.toPrecision(1);
},
});
}
getViews()
}
</script>
</dom-module>
Комментарии:
1. ytr3 уже должен быть ytr /100. В моем примере была опечатка, в которой был пробел между этим. и ytr3, просто удалите его.
2. Спасибо, это решило проблему! Просто нужно было добавить
self
к нему var