Как я могу получить два значения из массива и включить их в новую функцию все в контроллере angularjs

0

Я новичок в веб-разработке (начал со стека MEAN), и я застрял в этом, я полагаю, очевидный ответ, но я не мог найти решение здесь, поэтому я подумал, что даю ему шанс.

То, что я хотел бы сделать кратко:

  • Получить несколько значений из массива
  • Включить эти извлеченные значения в новую область
  • Все должно произойти в контроллере, поскольку я хотел бы опубликовать все значения, в том числе новые в моей базе данных (mongo).

В идеале я хотел бы получить значения и добавить их к новому значению

index = value[0]*weight[0] + value[1]*weight[1].... and so forth

У меня есть следующий фрагмент кода внутри моего углового контроллера

 $scope.alerts = [
    { title: 'someTitle1',
      weighttitle: 'someweightTitle1',
      value: 1,
      weight: 30,
      options: {
        showTicks: true,
        hidePointerLabels: true,
        hideLimitLabels: true,
        stepsArray: [
            { value: 1, legend: 'Very poor' },
            { value: 2, legend: 'Very poor' },
            { value: 3, legend: 'Fair' },
            { value: 4, legend: 'Very poor' },
            { value: 5, legend: 'Average' }

        ]
      }
    },
    { title: 'someTitle2',
      weighttitle: 'someweightTitle2',
      value: 1,
      weight: 60,
      options: {
        showTicks: true,
        hidePointerLabels: true,
        hideLimitLabels: true,
        stepsArray: [
            { value: 1, legend: 'Very poor' },
            { value: 2, legend: 'Very poor' },
            { value: 3, legend: 'Fair' },
            { value: 4, legend: 'Very poor' },
            { value: 5, legend: 'Average' }

        ]
      }
    }
];

Я думал, что решение должно каким-то образом выглядеть

$scope.index = alert.value*alert.weight

но это не совсем так. На данный момент я довольно не знаю, как получить эти значения. Возможно, у меня есть непонимание основополагающей концепции.

Благодарен за любую помощь!

Решения действительно работали, но они не менялись динамически. Код HTML для этой проблемы выглядит так:

<section ng-controller="ArticlesController">
  <div class="page-header">
    <h1>Neue Evaluierung</h1>
  </div>
  <div class="col-md-12">
    <form name="articleForm" class="form-horizontal" ng-submit="create(articleForm.$valid)" novalidate>
      <fieldset>

        <div class="row form-group">
         <h3>Projekttitel</h3><input type="submit" class="btn btn-default btn-lg btn-success">
        </div>
        <div ng-show="error" class="text-danger">
          <strong ng-bind="error"></strong>
        </div>

        <input name="title" type="text" ng-model="title" id="title" class="form-control">

        <div ng-repeat="alert in alerts">

          <h3>{{alert.someTitle}}</h3>
          <input type="number" ng-model="alert.value"/>

          <div>
            <rzslider rz-slider-model="alert.value"
                      rz-slider-options="alert.options"></rzslider>
          </div>

          <br>
          <br>
          <br>
          <br>

          <div>
            <h4>{{alert.someweightTitle}}</h4>
            <input type="number" ng-model="alert.weight"/>
            <div>
              <md-slider flex md-discrete ng-model="alert.weight" step="1" min="1" max="100" aria-label="rating"></md-slider>
            </div>
          </div>

          <input type="number" ng-model="index"/>
          <input type="number" ng-model="indexdynamic"/>

        </div>


      </fieldset>
    </form>
  </div>
</section>
Теги:

2 ответа

0
Лучший ответ

ОБНОВИТЬ:

Вышеприведенный код показывает в ng-repeat массив alerts с вычисленным index. Он также предоставляет форму, которая может добавить элемент в массив alerts, а также вычислить его index.

Вы можете попробовать его на этом скрипке.

HTML-код

<section ng-controller="ArticlesController">
  <div class="col-md-12">
    <div ng-repeat="alert in alerts">
      <strong>{{alert.title}}</strong>: {{alert.value}}
      <br/>
      <strong>{{alert.weighttitle}}</strong>: {{alert.weight}}
      <br/>
      <strong>Index:</strong> {{alert.index}}<br/><br/>
    </div>
    <form>
      <h1>Add an alert</h1>
      Title:<input type="text" ng-model="new.title"/><br/>
      Value:<input type="text" ng-model="new.value"/><br/>
      Weight title:<input type="text" ng-model="new.weighttitle"/><br/>
      Weight:<input type="text" ng-model="new.weight"/><br/>
      Index: {{new.value * new.weight}}<br/>
      <button type="submit" ng-click="create()">Add this!</button>
    </form>
  </div>
</section>

Код AngularJS

var myApp = angular.module('myApp', []);

function ArticlesController($scope) {
  $scope.new = {};

  $scope.alerts = [
      { title: 'someTitle1',
        weighttitle: 'someweightTitle1',
        value: 1,
        weight: 30,
        options: {
          showTicks: true,
          hidePointerLabels: true,
          hideLimitLabels: true,
          stepsArray: [
              { value: 1, legend: 'Very poor' },
              { value: 2, legend: 'Very poor' },
              { value: 3, legend: 'Fair' },
              { value: 4, legend: 'Very poor' },
              { value: 5, legend: 'Average' }

          ]
        }
      },
      { title: 'someTitle2',
        weighttitle: 'someweightTitle2',
        value: 1,
        weight: 60,
        options: {
          showTicks: true,
          hidePointerLabels: true,
          hideLimitLabels: true,
          stepsArray: [
              { value: 1, legend: 'Very poor' },
              { value: 2, legend: 'Very poor' },
              { value: 3, legend: 'Fair' },
              { value: 4, legend: 'Very poor' },
              { value: 5, legend: 'Average' }
          ]
        }
      }
  ];

  for(var i = 0; i < $scope.alerts.length; i++) {
    // Add value * weight to index
    $scope.alerts[i].index = $scope.alerts[i].value * $scope.alerts[i].weight;
  }

  $scope.create = function() {
      // Calculate index
      $scope.new.index = $scope.new.value * $scope.new.weight;
      // Add it to the array
      $scope.alerts.push(JSON.parse(JSON.stringify($scope.new)));
  }
}
Поделиться
  • 0
    Это работает как шарм, но, к сожалению, результат не меняется, когда ввод изменяется в представлении HTML
  • 0
    Вы можете использовать его в функции, вызываемой при изменении вашего ввода. Можете ли вы предоставить мне некоторый HTML-код, чтобы я мог адаптировать его к вашим потребностям?
Показать ещё 3 комментария
0

Вы можете использовать функцию уменьшения следующим образом:

var alerts = [
    { title: 'someTitle1',
      weighttitle: 'someweightTitle1',
      value: 1,
      weight: 30,
      options: {
        showTicks: true,
        hidePointerLabels: true,
        hideLimitLabels: true,
        stepsArray: [
            { value: 1, legend: 'Very poor' },
            { value: 2, legend: 'Very poor' },
            { value: 3, legend: 'Fair' },
            { value: 4, legend: 'Very poor' },
            { value: 5, legend: 'Average' }

        ]
      }
    },
    { title: 'someTitle2',
      weighttitle: 'someweightTitle2',
      value: 1,
      weight: 60,
      options: {
        showTicks: true,
        hidePointerLabels: true,
        hideLimitLabels: true,
        stepsArray: [
            { value: 1, legend: 'Very poor' },
            { value: 2, legend: 'Very poor' },
            { value: 3, legend: 'Fair' },
            { value: 4, legend: 'Very poor' },
            { value: 5, legend: 'Average' }

        ]
      }
    }
];

var index = alerts.reduce(function(prev, next) {
  return prev + (next.value*next.weight);  
}, 0);

console.log(index); // 90

Конечно, вам нужно сохранить результат в своей области. Я просто проигнорировал область действия для фрагмента, поскольку он не имеет отношения к функции уменьшения.

Поделиться
  • 0
    Это работает как шарм, но, к сожалению, результат не меняется, когда ввод изменяется в представлении HTML
  • 0
    Потому что рассчитал индекс. Он не был рассчитан динамически, но, тем не менее, рассчитан. Я полагаю, чтобы рассчитать его динамически, я должен как-то реализовать функцию наблюдения.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню