Даниил Попов

Если однократная передача то через инжектор.
Еще общаться можно через сервисы или получив componentInstance.
Если прям в шаблон надо инпуты, то есть либы типа https://github.com/IndigoSoft/ngxd но как правило можно и без них. Поскольку все типизируется, а тут получается динамический непредсказуемый инпут.
Лучше тогда сделать обертку с ngSwitch. Чуть медленнее, но понятней.

test.png картинка где-то кешируется и выводится все желающим. Генерируй картинку как base64 строку и вставляй ее как src тегу img.

Напишите пожалуйста, буду рад любым ответам.

Видимо в том, в каком попросит.

Да, возможно:

import { createApp } from 'vue';

createApp({
  components: {
    // Список компонентов, которые могут использоваться в шаблоне 
  },
})
  .use(store)
  .mount('#app');

Единственный момент - необходимо использовать при подключении сборку, которая поддерживает парсинг шаблонов. По умолчанию используется меньшая по размеру сборка без этой возможности, а за парсинг шаблонов отвечает vue-loader.

Чтобы код выше работал можно подправить либо импорт на 'vue/dist/vue.esm-bundler.js'', либо добавить во vue.config.js секцию:

const buildConfig = {
  // Может быть что-то выше
  configureWebpack: {
    resolve: {
      alias: {
        vue$: 'vue/dist/vue.esm-bundler.js',
      },
    },
  },
  // Может еще что-то
};

module.exports = buildConfig;

Не про циклы, правда.. CSS-селекторами можно выбирать чётные и нечётные элементы.

const even = [...document.querySelectorAll(".flex-sec > div:nth-child(even)")];
const odd = [...document.querySelectorAll(".flex-sec > div:nth-child(odd)")];
const className = '_tog-sw';

let counter = 0;

document.querySelector(".flex-sec > button")
  .addEventListener('click', () => {
    counter++;
    [odd, even].forEach((arr, i) => {
      arr.forEach((el) => el.classList[i === (counter & 1) ? 'add' : 'remove'](className));
    });
  });

Больно смотреть на ваш код :( именование функций и переменных за пределами моего восприятия

html

<section class="flex-sec">
  <button>BTN</button>
  <div>1</div>
  <div>2</div>
  <div>3</div>
  <div>4</div>
  <div>5</div>
</section>

css

section {
  display: flex;
  button {
    width: 50px;
    height: 50px;
    border: solid 4px black;
    background: yellow;
  }
}
div {
  width: 200px;
  height: 200px;
  background: #00ff0b;
  margin: 10px;
}

.b1 {
  background: #fc0;
}

js

let cards = document.querySelectorAll(".flex-sec > div");
let button = document.querySelector(".flex-sec>button");
let firstClick = true;

button.addEventListener("click", switchColor);

function switchColor() {
  for (let i = 0; i < cards.length; i++) {
    if (firstClick) {
      if (i % 2 == 0) {
        cards[i].classList.add("b1");
      }
    } else {
      cards[i].classList.toggle("b1");
    }
  }
  firstClick = false;
}

Напиши класс Expression который будет иметь методы:
Add(value) - добавить value значение к выражению
Substract(value) - отнять value от значения выражения
Divide(value) - разделить значение у выражения на число value
Multiply(value) - умножить значение выражения на число value
Result: Float - свойство, возвращающее итог внутри котрого происходит проверка что выражение корректно.

Сам класс имеет внутренне поле currentValue с которым и производит операции.
Каждый метод класса выполняет операцию над currentValue и в качестве результата возвращает сам себя.

т.е. код калькулятора будет простым:

let calc: Calculator = new Calculator(0); //значение currentValue по умолчанию
let result: number = calc
.Add(1) //0+1 = 1
.Substract(5) //1 - -5 = -4
.Multiply(4) //-4 * 4 = -16
.Result; //-16
alert(result);

можно добавить туда скобки:
OpenBrackets: Expression
CloseBrackets: Expression
Другие мат. операции и прочее.

в UI же классу передать callback'функцию когда изменяется выражение, когда ошибка и т.д.

Фича таймаутов в том что браузер замедляет их работу в неактивных вкладках для экономии ресурсов. До 1 раза в секунду если мне не изменяет память.

Соответственно ваша задача не создавать кучу интервалов и ждать как они отработают.

А создать start_timestamp и пачку breakpoint_timestamp(s). А потом запустить простейший setInterval и раз в секунду проверять разницу между текущем временем, стартовым временем и брейкпоинтами.

Я начинающий фронтенд разработчик

Правильный вариант ответа:

Здравствуйте, я джун|миддл который работает год в компании фронтом, умею отлично во фронт, и хотелось бы углубиться в бэк | название языка

В попытке усидеть на всех стульях разом, вы вряд ли сдвинетесь с места. Если вы фронт, то бэк вы выбираете:

а) сами, если у вас собственное приложение ака пет=проект(при условии что вы выполнили свою первую и важную цель - устроится на работу
б) более часто - бэк уже выбран за вас, и вы его узнаете на работе, когда вам отдают конечные endpoints и показывают архитектуру проекта.

Приведу аналогию: вы начинающий водитель, ваша задача - научиться водить, дабы уверенно себя чувствовать в городе(выехать и не создавать критической ситуации).

Вы: я не поеду в город, пока не выучу досконально работу двигателя, трансмиссии.

Вывод: не лезьте в бэк, не забивайте голову лишний информацией - её и так много. Сперва уложите в правильном порядке один стэк,устройтесь на работу - второй стэк.

Потому что читаем документацию по call и что передаётся в качестве первого аргумента.
https://developer.mozilla.org/ru/docs/Web/JavaScri...

По документации.

могут:

new Компонент({
  propsData: {
    ...
  },
}).$mount(элемент);

function filterByCategory(cat) {
  const dataCats = $("[data-cat]");
  if (cat == 'all') {
    dataCats.removeClass("hide");
  } else {
    dataCats.each(function () {
      if (cat == $(this).data('cat')) {
        $(this).removeClass('hide');
      } else {
        $(this).addClass('hide');
      }
    });
  }
}

$(function () {
  const worksSlider = $('[data-slider="slick"]');

  /* Filter
  =====================*/
  const filter = $("[data-filter]");

  filter.on("click", function (event) {
    event.preventDefault();
    const cat = $(this).data('filter');
    filterByCategory(cat);
  });
  
  filterByCategory('female');
});

Как вариант:

string.split(' ')
  .sort((a, b) => parseInt(a.match(/\d+/)) - parseInt(b.match(/\d+/)))
  .join(' ');